refactor main nav

This commit is contained in:
Lyn Fugmann 2024-09-24 16:28:54 +02:00
parent 9aaf9c2a3d
commit b2e465abc4
2 changed files with 7 additions and 6 deletions

View file

@ -30,7 +30,7 @@ header {
margin-left: 1.9rem; margin-left: 1.9rem;
} }
#mainNav a { .nav-item {
position: relative; position: relative;
font-size: 16px; font-size: 16px;
font-family: Aileron; font-family: Aileron;
@ -41,7 +41,7 @@ header {
text-decoration: none; text-decoration: none;
} }
#mainNav a::after { .nav-item::after {
content: ""; content: "";
position: absolute; position: absolute;
background: var(--color-primary); background: var(--color-primary);
@ -53,7 +53,7 @@ header {
transition: opacity .3s ease-out; transition: opacity .3s ease-out;
} }
#mainNav a:hover::after, .nav-item:hover::after,
#mainNav .nav-active a::after { .nav-item.active::after {
opacity: 1; opacity: 1;
} }

View file

@ -7,8 +7,9 @@
{% set navPages = collections.mainNav | pageLang | eleventyNavigation %} {% set navPages = collections.mainNav | pageLang | eleventyNavigation %}
<ul> <ul>
{%- for entry in navPages -%} {%- for entry in navPages -%}
<li{% if entry.url == page.url %} class="nav-active"{% endif %}> <li>
<a href="{{ entry.url }}">{{ entry.title }}</a> <a class="nav-item {%- if entry.url == page.url %} active{% endif %}"
href="{{ entry.url }}">{{ entry.title }}</a>
</li> </li>
{%- endfor %} {%- endfor %}
</ul> </ul>