refactor main nav
This commit is contained in:
parent
9aaf9c2a3d
commit
b2e465abc4
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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>
|
||||||
|
|
Loading…
Reference in a new issue