diff --git a/internal/template/templates/common/layout.html b/internal/template/templates/common/layout.html index f2017659..e10eab99 100644 --- a/internal/template/templates/common/layout.html +++ b/internal/template/templates/common/layout.html @@ -85,20 +85,20 @@ aria-label="{{ t "menu.unread" }}, {{ plural "page.unread_entry_count" .countUnread .countUnread }}" {{ end }} > - {{ t "menu.unread" }} + {{ icon "entries" }}{{ t "menu.unread" }} {{ if gt .countUnread 0 }} {{ end }}
  • - {{ t "menu.starred" }} + {{ icon "star" }}{{ t "menu.starred" }}
  • - {{ t "menu.history" }} + {{ icon "history" }}{{ t "menu.history" }}
  • - {{ t "menu.feeds" }} + {{ icon "feeds" }}{{ t "menu.feeds" }} {{ if gt .countErrorFeeds 0 }} ({{ .countErrorFeeds }}) {{ end }} @@ -108,17 +108,17 @@
  • - {{ t "menu.categories" }} + {{ icon "categories" }}{{ t "menu.categories" }}
  • - {{ t "menu.search" }} + {{ icon "search" }}{{ t "menu.search" }}
  • - {{ t "menu.settings" }} + {{ icon "settings" }}{{ t "menu.settings" }}
  • {{ if not hasAuthProxy }}
  • - {{ t "menu.logout" }} + {{ icon "logout" }}{{ t "menu.logout" }}
  • {{ end }} diff --git a/internal/ui/static/bin/sprite.svg b/internal/ui/static/bin/sprite.svg index e941e6b8..7ff7b1c7 100644 --- a/internal/ui/static/bin/sprite.svg +++ b/internal/ui/static/bin/sprite.svg @@ -200,4 +200,19 @@ Source: https://github.com/tabler/tabler-icons + + + + + + + + + + + + + + + diff --git a/internal/ui/static/css/common.css b/internal/ui/static/css/common.css index f7574796..2034d1c2 100644 --- a/internal/ui/static/css/common.css +++ b/internal/ui/static/css/common.css @@ -175,8 +175,9 @@ a:hover { white-space: nowrap; } +#header-menu .icon, .page-header ul a .icon { - padding-bottom: 2px; + margin-bottom: 2px; } .page-header-action-form { @@ -239,7 +240,7 @@ a:hover { #btn-add-to-home-screen { text-decoration: none; - line-height: 30px; + height: 30px; color: #fff; background-color: transparent; border: 0; @@ -282,13 +283,13 @@ a:hover { } /* Hide the logo when there is not enough space to display menus when using languages more verbose than English */ -@media (min-width: 620px) and (max-width: 830px) { +@media (min-width: 620px) and (max-width: 850px) { .logo { display: none; } } -@media (min-width: 830px) { +@media (min-width: 850px) { .logo { padding-right: 8px; } @@ -297,7 +298,7 @@ a:hover { @media (min-width: 620px) { body { margin: auto; - max-width: 820px; + max-width: 900px; /* Wide enough to display the logo and the menu one a single row for any languages */ } .header { @@ -306,14 +307,13 @@ a:hover { .header li { display: inline-block; - padding: 0 12px 0 0; + padding: 0 5px 0 0; line-height: normal; border: none; font-size: 1.0em; } .header nav { - align-items: end; flex-direction: row; } @@ -931,9 +931,9 @@ article.category-has-unread { /* Icons */ .icon, .icon-label { - vertical-align: middle; + vertical-align: text-bottom; display: inline-block; - padding-right: 2px; + margin-right: 2px; } .icon {