From 63258147ee108736b429b831f706a83b95b941e4 Mon Sep 17 00:00:00 2001 From: "Edgar P. Burkhart" Date: Thu, 4 Jan 2024 18:33:56 +0100 Subject: [PATCH] Add icons to navbar --- nummi/main/static/main/css/main.css | 22 +++++++++++++++++----- nummi/main/templates/main/base.html | 22 ++++++++++++++++------ 2 files changed, 33 insertions(+), 11 deletions(-) diff --git a/nummi/main/static/main/css/main.css b/nummi/main/static/main/css/main.css index 2a236d0..d532a1c 100644 --- a/nummi/main/static/main/css/main.css +++ b/nummi/main/static/main/css/main.css @@ -1,4 +1,5 @@ @import "https://rsms.me/inter/inter.css"; +@import "https://cdn.jsdelivr.net/npm/remixicon@4.0.0/fonts/remixicon.css"; *, *::before, @@ -152,13 +153,22 @@ nav { font-weight: 500; } } - display: block; + display: grid; + grid-template-columns: 1fr max-content; + align-items: baseline; + + [class^="ri-"] { + height: 1.5em; + width: 1.5em; + line-height: 1.5em; + border-radius: var(--radius); + } + &.cur { font-weight: 550; - &::after { - content: "◎"; - position: absolute; - right: 0; + [class^="ri-"] { + background: var(--text-link); + color: var(--bg); } } } @@ -229,6 +239,8 @@ footer { } } [class^="ri-"] { + display: inline-block; + text-align: center; font-weight: normal; &.green, diff --git a/nummi/main/templates/main/base.html b/nummi/main/templates/main/base.html index a07113a..1ac1bb0 100644 --- a/nummi/main/templates/main/base.html +++ b/nummi/main/templates/main/base.html @@ -12,7 +12,6 @@ {% block link %} {% css "main/css/main.css" %} - {% css "main/remixicon/remixicon.css" %} {% endblock %} @@ -31,27 +30,38 @@
  • {% translate "Home" %} + accesskey="h"> + {% translate "Home" %} + {{ "home"|remix }} +
  • - {% translate "Statements" %} + {% translate "Statements" %} + {{ "file"|remix }}
  • - {% translate "Transactions" %} + {% translate "Transactions" %} + {{ "receipt"|remix }}
  • {% translate "Search" %} + accesskey="r"> + {% translate "Search" %} + {{ "search"|remix }} +
  • - {% translate "Log out" %} + + {% translate "Log out" %} + {{ "close-circle"|remix }} +
  • {% else %}