From 312b4a54c1664b07e6f34474018545d80b6833b6 Mon Sep 17 00:00:00 2001 From: Nazar Kanaev Date: Fri, 26 Jun 2020 22:40:44 +0100 Subject: [PATCH] ui tweaks --- template/index.html | 39 +++++++++---------- template/static/images/more-vertical.svg | 1 + template/static/javascripts/app.js | 17 ++++++++ .../static/javascripts/v-click-outside.umd.js | 2 + template/static/stylesheets/app.css | 4 ++ 5 files changed, 42 insertions(+), 21 deletions(-) create mode 100644 template/static/images/more-vertical.svg create mode 100644 template/static/javascripts/v-click-outside.umd.js diff --git a/template/index.html b/template/index.html index f22027b..64985c9 100644 --- a/template/index.html +++ b/template/index.html @@ -2,7 +2,7 @@ - + yarr @@ -128,28 +128,22 @@
{{ folder.title || "Uncategorized" }}
-
- -
- - -
-
- - {{ feed.title }} - + {{ feed.title }}
- -
+
+ + Rename + +
+
Move to...
Uncategorized {{ folder.title }} +
+ + Delete +
-
@@ -184,6 +180,7 @@ + diff --git a/template/static/images/more-vertical.svg b/template/static/images/more-vertical.svg new file mode 100644 index 0000000..cba6958 --- /dev/null +++ b/template/static/images/more-vertical.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/template/static/javascripts/app.js b/template/static/javascripts/app.js index 236b521..ee3307e 100644 --- a/template/static/javascripts/app.js +++ b/template/static/javascripts/app.js @@ -6,6 +6,7 @@ var FILTERS = [ {'title': 'Starred', 'value': 'starred', 'icon': 'star'}, ] +Vue.use(window['v-click-outside']) var vm = new Vue({ el: '#app', @@ -103,6 +104,22 @@ var vm = new Vue({ is_expanded: true, }) }, + renameFeed: function(feed) { + var newTitle = prompt('Enter new title', feed.title) + feed.title = newTitle + this.settingsManageDropdown = null + }, + deleteFeed: function(feed) { + if (confirm('Are you sure you want to delete ' + feed.title + '?')) { + this.feeds = this.feeds.filter(function(f) { f.id != feed.id }) + } + }, + hideSettingsMenu: function() { + this.settingsManageDropdown = null + }, + hideSettingsModal: function() { + this.settingsShow = false + }, } }) vm.settingsShow = true diff --git a/template/static/javascripts/v-click-outside.umd.js b/template/static/javascripts/v-click-outside.umd.js new file mode 100644 index 0000000..5274d1e --- /dev/null +++ b/template/static/javascripts/v-click-outside.umd.js @@ -0,0 +1,2 @@ +!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e["v-click-outside"]=n()}(this,function(){var e="__v-click-outside",n="undefined"!=typeof window,t="undefined"!=typeof navigator,i=n&&("ontouchstart"in window||t&&navigator.msMaxTouchPoints>0)?["touchstart"]:["click"];function o(n,t){var o=function(e){var n="function"==typeof e;if(!n&&"object"!=typeof e)throw new Error("v-click-outside: Binding value must be a function or an object");return{handler:n?e:e.handler,middleware:e.middleware||function(e){return e},events:e.events||i,isActive:!(!1===e.isActive)}}(t.value),r=o.handler,d=o.middleware;o.isActive&&(n[e]=o.events.map(function(e){return{event:e,handler:function(e){return function(e){var n=e.el,t=e.event,i=e.handler,o=e.middleware,r=t.path||t.composedPath&&t.composedPath(),d=r?r.indexOf(n)<0:!n.contains(t.target);t.target!==n&&d&&o(t)&&i(t)}({event:e,el:n,handler:r,middleware:d})}}}),n[e].forEach(function(t){var i=t.event,o=t.handler;return setTimeout(function(){n[e]&&document.documentElement.addEventListener(i,o,!1)},0)}))}function r(n){(n[e]||[]).forEach(function(e){return document.documentElement.removeEventListener(e.event,e.handler,!1)}),delete n[e]}var d=n?{bind:o,update:function(e,n){var t=n.value,i=n.oldValue;JSON.stringify(t)!==JSON.stringify(i)&&(r(e),o(e,{value:t}))},unbind:r}:{};return{install:function(e){e.directive("click-outside",d)},directive:d}}); +//# sourceMappingURL=v-click-outside.umd.js.map diff --git a/template/static/stylesheets/app.css b/template/static/stylesheets/app.css index 962acc1..1919e54 100644 --- a/template/static/stylesheets/app.css +++ b/template/static/stylesheets/app.css @@ -74,3 +74,7 @@ body { .expanded { transform: rotate(90deg); } + +.dropdown-header { + cursor: default; +}