Add icons to navbar
This commit is contained in:
parent
67e71b717b
commit
63258147ee
2 changed files with 33 additions and 11 deletions
|
@ -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,
|
||||
|
|
|
@ -12,7 +12,6 @@
|
|||
{% block link %}
|
||||
<link rel="icon" href="{% static "main/svg/logo.svg" %}" type="image/svg+xml">
|
||||
{% css "main/css/main.css" %}
|
||||
{% css "main/remixicon/remixicon.css" %}
|
||||
{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
|
@ -31,27 +30,38 @@
|
|||
<li>
|
||||
<a href="{% url "index" %}"
|
||||
class="home{% if request.resolver_match.url_name == "index" %} cur{% endif %}"
|
||||
accesskey="h">{% translate "Home" %}</a>
|
||||
accesskey="h">
|
||||
<span>{% translate "Home" %}</span>
|
||||
{{ "home"|remix }}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{% url "statements" %}"
|
||||
class="{% if request.resolver_match.url_name == "statements" %}cur{% endif %}">
|
||||
{% translate "Statements" %}
|
||||
<span>{% translate "Statements" %}</span>
|
||||
{{ "file"|remix }}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{% url "transactions" %}"
|
||||
class="{% if request.resolver_match.url_name == "transactions" %}cur{% endif %}">
|
||||
{% translate "Transactions" %}
|
||||
<span>{% translate "Transactions" %}</span>
|
||||
{{ "receipt"|remix }}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{% url "search" %}"
|
||||
class="{% if request.resolver_match.url_name == "search" %}cur{% endif %}"
|
||||
accesskey="r">{% translate "Search" %}</a>
|
||||
accesskey="r">
|
||||
<span>{% translate "Search" %}</span>
|
||||
{{ "search"|remix }}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{% url "logout" %}" accesskey="l">{% translate "Log out" %}</a>
|
||||
<a href="{% url "logout" %}" accesskey="l">
|
||||
<span>{% translate "Log out" %}</span>
|
||||
{{ "close-circle"|remix }}
|
||||
</a>
|
||||
</li>
|
||||
{% else %}
|
||||
<li>
|
||||
|
|
Loading…
Reference in a new issue