From c891ab2588159e3d349baf2fe2768d0c44abcaeb Mon Sep 17 00:00:00 2001
From: Thiago Perrotta <tbperrotta@gmail.com>
Date: Tue, 18 Jan 2022 00:00:32 -0500
Subject: [PATCH] Add several icons to menus according to their roles
- refresh: https://tabler-icons.io/i/refresh
- edit: https://tabler-icons.io/i/edit
- delete: https://tabler-icons.io/i/delete
- mark page as read: https://tabler-icons.io/i/check
- mark all as read: https://tabler-icons.io/i/checks
- show all entries: https://tabler-icons.io/i/eye
- show only unread entries: https://tabler-icons.io/i/eye-off
- create category: https://tabler-icons.io/i/folder-plus
- add subscription: https://tabler-icons.io/i/plus
- import: https://tabler-icons.io/i/file-import
- export: https://tabler-icons.io/i/file-export
- categories: https://tabler-icons.io/i/folders
---
template/templates/common/feed_menu.html | 12 ++---
template/templates/views/categories.html | 2 +-
.../templates/views/category_entries.html | 12 ++---
template/templates/views/category_feeds.html | 6 +--
template/templates/views/create_category.html | 2 +-
template/templates/views/edit_category.html | 6 +--
template/templates/views/edit_feed.html | 6 +--
template/templates/views/feed_entries.html | 16 +++----
template/templates/views/sessions.html | 2 +-
template/templates/views/unread_entries.html | 6 +--
ui/static/bin/sprite.svg | 48 ++++++++++++++++++-
11 files changed, 82 insertions(+), 36 deletions(-)
diff --git a/template/templates/common/feed_menu.html b/template/templates/common/feed_menu.html
index faba6fd2..bbbdcf04 100644
--- a/template/templates/common/feed_menu.html
+++ b/template/templates/common/feed_menu.html
@@ -1,19 +1,19 @@
{{ define "feed_menu" }}
<ul>
<li>
- <a href="{{ route "feeds" }}">{{ t "menu.feeds" }}</a>
+ <a href="{{ route "feeds" }}">{{ icon "feeds" }}{{ t "menu.feeds" }}</a>
</li>
<li>
- <a href="{{ route "addSubscription" }}">{{ t "menu.add_feed" }}</a>
+ <a href="{{ route "addSubscription" }}">{{ icon "add-feed" }}{{ t "menu.add_feed" }}</a>
</li>
<li>
- <a href="{{ route "export" }}">{{ t "menu.export" }}</a>
+ <a href="{{ route "export" }}">{{ icon "feed-export" }}{{ t "menu.export" }}</a>
</li>
<li>
- <a href="{{ route "import" }}">{{ t "menu.import" }}</a>
+ <a href="{{ route "import" }}">{{ icon "feed-import" }}{{ t "menu.import" }}</a>
</li>
<li>
- <a href="{{ route "refreshAllFeeds" }}">{{ t "menu.refresh_all_feeds" }}</a>
+ <a href="{{ route "refreshAllFeeds" }}">{{ icon "refresh" }}{{ t "menu.refresh_all_feeds" }}</a>
</li>
</ul>
-{{ end }}
\ No newline at end of file
+{{ end }}
diff --git a/template/templates/views/categories.html b/template/templates/views/categories.html
index 4ecd8a46..8e593474 100644
--- a/template/templates/views/categories.html
+++ b/template/templates/views/categories.html
@@ -5,7 +5,7 @@
<h1>{{ t "page.categories.title" }} ({{ .total }})</h1>
<ul>
<li>
- <a href="{{ route "createCategory" }}">{{ t "menu.create_category" }}</a>
+ <a href="{{ route "createCategory" }}">{{ icon "add-category" }}{{ t "menu.create_category" }}</a>
</li>
</ul>
</section>
diff --git a/template/templates/views/category_entries.html b/template/templates/views/category_entries.html
index 392a40dc..7041e19f 100644
--- a/template/templates/views/category_entries.html
+++ b/template/templates/views/category_entries.html
@@ -12,7 +12,7 @@
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
- data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
+ data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ icon "mark-page-as-read" }}{{ t "menu.mark_page_as_read" }}</a>
</li>
<li>
<a href="#"
@@ -21,20 +21,20 @@
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
- data-url="{{ route "markCategoryAsRead" "categoryID" .category.ID }}">{{ t "menu.mark_all_as_read" }}</a>
+ data-url="{{ route "markCategoryAsRead" "categoryID" .category.ID }}">{{ icon "mark-all-as-read" }}{{ t "menu.mark_all_as_read" }}</a>
</li>
{{ end }}
{{ if .showOnlyUnreadEntries }}
<li>
- <a href="{{ route "categoryEntriesAll" "categoryID" .category.ID }}">{{ t "menu.show_all_entries" }}</a>
+ <a href="{{ route "categoryEntriesAll" "categoryID" .category.ID }}">{{ icon "show-all-entries" }}{{ t "menu.show_all_entries" }}</a>
</li>
{{ else }}
<li>
- <a href="{{ route "categoryEntries" "categoryID" .category.ID }}">{{ t "menu.show_only_unread_entries" }}</a>
+ <a href="{{ route "categoryEntries" "categoryID" .category.ID }}">{{ icon "show-unread-entries" }}{{ t "menu.show_only_unread_entries" }}</a>
</li>
{{ end }}
<li>
- <a href="{{ route "categoryFeeds" "categoryID" .category.ID }}">{{ t "menu.feeds" }}</a>
+ <a href="{{ route "categoryFeeds" "categoryID" .category.ID }}">{{ icon "feeds" }}{{ t "menu.feeds" }}</a>
</li>
</ul>
</section>
@@ -71,7 +71,7 @@
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
- data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
+ data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ icon "mark-page-as-read" }}{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}
diff --git a/template/templates/views/category_feeds.html b/template/templates/views/category_feeds.html
index 9e92d153..26d4d2a7 100644
--- a/template/templates/views/category_feeds.html
+++ b/template/templates/views/category_feeds.html
@@ -5,10 +5,10 @@
<h1 dir="auto">{{ .category.Title }} > {{ t "page.feeds.title" }} ({{ .total }})</h1>
<ul>
<li>
- <a href="{{ route "categoryEntries" "categoryID" .category.ID }}">{{ t "menu.feed_entries" }}</a>
+ <a href="{{ route "categoryEntries" "categoryID" .category.ID }}">{{ icon "entries" }}{{ t "menu.feed_entries" }}</a>
</li>
<li>
- <a href="{{ route "editCategory" "categoryID" .category.ID }}">{{ t "menu.edit_category" }}</a>
+ <a href="{{ route "editCategory" "categoryID" .category.ID }}">{{ icon "edit" }}{{ t "menu.edit_category" }}</a>
</li>
{{ if eq .total 0 }}
<li>
@@ -19,7 +19,7 @@
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-redirect-url="{{ route "categories" }}"
- data-url="{{ route "removeCategory" "categoryID" .category.ID }}">{{ t "action.remove" }}</a>
+ data-url="{{ route "removeCategory" "categoryID" .category.ID }}">{{ icon "delete" }}{{ t "action.remove" }}</a>
</li>
{{ end }}
</ul>
diff --git a/template/templates/views/create_category.html b/template/templates/views/create_category.html
index 1a7212c6..c6be3e6f 100644
--- a/template/templates/views/create_category.html
+++ b/template/templates/views/create_category.html
@@ -5,7 +5,7 @@
<h1>{{ t "page.new_category.title" }}</h1>
<ul>
<li>
- <a href="{{ route "categories" }}">{{ t "menu.categories" }}</a>
+ <a href="{{ route "categories" }}">{{ icon "categories" }}{{ t "menu.categories" }}</a>
</li>
</ul>
</section>
diff --git a/template/templates/views/edit_category.html b/template/templates/views/edit_category.html
index 5fbc91e1..4412ff97 100644
--- a/template/templates/views/edit_category.html
+++ b/template/templates/views/edit_category.html
@@ -5,13 +5,13 @@
<h1>{{ t "page.edit_category.title" .category.Title }}</h1>
<ul>
<li>
- <a href="{{ route "categories" }}">{{ t "menu.categories" }}</a>
+ <a href="{{ route "categories" }}">{{ icon "categories" }}{{ t "menu.categories" }}</a>
</li>
<li>
- <a href="{{ route "categoryFeeds" "categoryID" .category.ID }}">{{ t "menu.feeds" }}</a>
+ <a href="{{ route "categoryFeeds" "categoryID" .category.ID }}">{{ icon "feeds" }}{{ t "menu.feeds" }}</a>
</li>
<li>
- <a href="{{ route "createCategory" }}">{{ t "menu.create_category" }}</a>
+ <a href="{{ route "createCategory" }}">{{ icon "add-category" }}{{ t "menu.create_category" }}</a>
</li>
</ul>
</section>
diff --git a/template/templates/views/edit_feed.html b/template/templates/views/edit_feed.html
index b4c3efa1..f29e33e5 100644
--- a/template/templates/views/edit_feed.html
+++ b/template/templates/views/edit_feed.html
@@ -5,13 +5,13 @@
<h1 dir="auto">{{ .feed.Title }}</h1>
<ul>
<li>
- <a href="{{ route "feeds" }}">{{ t "menu.feeds" }}</a>
+ <a href="{{ route "feeds" }}">{{ icon "feeds" }}{{ t "menu.feeds" }}</a>
</li>
<li>
- <a href="{{ route "feedEntries" "feedID" .feed.ID }}">{{ t "menu.feed_entries" }}</a>
+ <a href="{{ route "feedEntries" "feedID" .feed.ID }}">{{ icon "entries" }}{{ t "menu.feed_entries" }}</a>
</li>
<li>
- <a href="{{ route "refreshFeed" "feedID" .feed.ID }}">{{ t "menu.refresh_feed" }}</a>
+ <a href="{{ route "refreshFeed" "feedID" .feed.ID }}">{{ icon "refresh" }}{{ t "menu.refresh_feed" }}</a>
</li>
</ul>
</section>
diff --git a/template/templates/views/feed_entries.html b/template/templates/views/feed_entries.html
index f3796e15..0a731551 100644
--- a/template/templates/views/feed_entries.html
+++ b/template/templates/views/feed_entries.html
@@ -15,7 +15,7 @@
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
- data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
+ data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ icon "mark-page-as-read" }}{{ t "menu.mark_page_as_read" }}</a>
</li>
<li>
<a href="#"
@@ -24,23 +24,23 @@
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
- data-url="{{ route "markFeedAsRead" "feedID" .feed.ID }}">{{ t "menu.mark_all_as_read" }}</a>
+ data-url="{{ route "markFeedAsRead" "feedID" .feed.ID }}">{{ icon "mark-all-as-read" }}{{ t "menu.mark_all_as_read" }}</a>
</li>
{{ end }}
{{ if .showOnlyUnreadEntries }}
<li>
- <a href="{{ route "feedEntriesAll" "feedID" .feed.ID }}">{{ t "menu.show_all_entries" }}</a>
+ <a href="{{ route "feedEntriesAll" "feedID" .feed.ID }}">{{ icon "show-all-entries" }}{{ t "menu.show_all_entries" }}</a>
</li>
{{ else }}
<li>
- <a href="{{ route "feedEntries" "feedID" .feed.ID }}">{{ t "menu.show_only_unread_entries" }}</a>
+ <a href="{{ route "feedEntries" "feedID" .feed.ID }}">{{ icon "show-unread-entries" }}{{ t "menu.show_only_unread_entries" }}</a>
</li>
{{ end }}
<li>
- <a href="{{ route "refreshFeed" "feedID" .feed.ID }}">{{ t "menu.refresh_feed" }}</a>
+ <a href="{{ route "refreshFeed" "feedID" .feed.ID }}">{{ icon "refresh" }}{{ t "menu.refresh_feed" }}</a>
</li>
<li>
- <a href="{{ route "editFeed" "feedID" .feed.ID }}">{{ t "menu.edit_feed" }}</a>
+ <a href="{{ route "editFeed" "feedID" .feed.ID }}">{{ icon "edit" }}{{ t "menu.edit_feed" }}</a>
</li>
<li>
<a href="#"
@@ -51,7 +51,7 @@
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
data-url="{{ route "removeFeed" "feedID" .feed.ID }}"
- data-redirect-url="{{ route "feeds" }}">{{ t "action.remove_feed" }}</a>
+ data-redirect-url="{{ route "feeds" }}">{{ icon "delete" }}{{ t "action.remove_feed" }}</a>
</li>
</ul>
</section>
@@ -99,7 +99,7 @@
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
- data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ t "menu.mark_page_as_read" }}</a>
+ data-show-only-unread="{{ if .showOnlyUnreadEntries }}1{{ end }}">{{ icon "mark-page-as-read" }}{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}
diff --git a/template/templates/views/sessions.html b/template/templates/views/sessions.html
index 09772b68..24192843 100644
--- a/template/templates/views/sessions.html
+++ b/template/templates/views/sessions.html
@@ -28,7 +28,7 @@
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}"
- data-url="{{ route "removeSession" "sessionID" .ID }}">{{ t "action.remove" }}</a>
+ data-url="{{ route "removeSession" "sessionID" .ID }}">{{ icon "delete" }}{{ t "action.remove" }}</a>
{{ end }}
</td>
</tr>
diff --git a/template/templates/views/unread_entries.html b/template/templates/views/unread_entries.html
index 8e00a055..b78153d2 100644
--- a/template/templates/views/unread_entries.html
+++ b/template/templates/views/unread_entries.html
@@ -12,7 +12,7 @@
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
- data-label-loading="{{ t "confirm.loading" }}">{{ t "menu.mark_page_as_read" }}</a>
+ data-label-loading="{{ t "confirm.loading" }}">{{ icon "mark-page-as-read" }}{{ t "menu.mark_page_as_read" }}</a>
</li>
<li>
<a href="#"
@@ -22,7 +22,7 @@
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
- data-label-loading="{{ t "confirm.loading" }}">{{ t "menu.mark_all_as_read" }}</a>
+ data-label-loading="{{ t "confirm.loading" }}">{{ icon "mark-all-as-read" }}{{ t "menu.mark_all_as_read" }}</a>
</li>
</ul>
{{ end }}
@@ -59,7 +59,7 @@
data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}"
- data-label-loading="{{ t "confirm.loading" }}">{{ t "menu.mark_page_as_read" }}</a>
+ data-label-loading="{{ t "confirm.loading" }}">{{ icon "mark-page-as-read" }}{{ t "menu.mark_page_as_read" }}</a>
</li>
</ul>
{{ end }}
diff --git a/ui/static/bin/sprite.svg b/ui/static/bin/sprite.svg
index 19163c10..99aff3fa 100644
--- a/ui/static/bin/sprite.svg
+++ b/ui/static/bin/sprite.svg
@@ -115,4 +115,50 @@ Source: https://github.com/tabler/tabler-icons
<path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7"></path>
<path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6"></path>
</symbol>
-</svg>
\ No newline at end of file
+ <symbol id="icon-mark-page-as-read" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+ <path d="M5 12l5 5l10 -10" />
+ </symbol>
+ <symbol id="icon-mark-all-as-read" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+ <path d="M7 12l5 5l10 -10" />
+ <path d="M2 12l5 5m5 -5l5 -5" />
+ </symbol>
+ <symbol id="icon-show-all-entries" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <circle cx="12" cy="12" r="2"></circle>
+ <path d="M22 12c-2.667 4.667 -6 7 -10 7s-7.333 -2.333 -10 -7c2.667 -4.667 6 -7 10 -7s7.333 2.333 10 7"></path>
+ </symbol>
+ <symbol id="icon-show-unread-entries" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <line x1="3" y1="3" x2="21" y2="21"></line>
+ <path d="M10.584 10.587a2 2 0 0 0 2.828 2.83"></path>
+ <path d="M9.363 5.365a9.466 9.466 0 0 1 2.637 -.365c4 0 7.333 2.333 10 7c-.778 1.361 -1.612 2.524 -2.503 3.488m-2.14 1.861c-1.631 1.1 -3.415 1.651 -5.357 1.651c-4 0 -7.333 -2.333 -10 -7c1.369 -2.395 2.913 -4.175 4.632 -5.341"></path>
+ </symbol>
+ <symbol id="icon-add-category" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2"></path>
+ <line x1="12" y1="10" x2="12" y2="16"></line>
+ <line x1="9" y1="13" x2="15" y2="13"></line>
+ </symbol>
+ <symbol id="icon-add-feed" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <line x1="12" y1="5" x2="12" y2="19"></line>
+ <line x1="5" y1="12" x2="19" y2="12"></line>
+ </symbol>
+ <symbol id="icon-feed-import" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M14 3v4a1 1 0 0 0 1 1h4"></path>
+ <path d="M5 13v-8a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2h-5.5m-9.5 -2h7m-3 -3l3 3l-3 3"></path>
+ </symbol>
+ <symbol id="icon-feed-export" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M14 3v4a1 1 0 0 0 1 1h4"></path>
+ <path d="M11.5 21h-4.5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v5m-5 6h7m-3 -3l3 3l-3 3"></path>
+ </symbol>
+ <symbol id="icon-categories" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M9 4h3l2 2h5a2 2 0 0 1 2 2v7a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-9a2 2 0 0 1 2 -2"></path>
+ <path d="M17 17v2a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-9a2 2 0 0 1 2 -2h2"></path>
+ </symbol>
+</svg>
--
GitLab