website-zola/templates/partials/nav.html
2024-09-11 21:22:13 +02:00

30 lines
1.1 KiB
HTML

<header>
<div class="main">
<a href={{ config.base_url }}>{{ config.title }}</a>
<div class="socials">
{% for social in config.extra.socials | default(value=[]) %}
<a rel="me" href="{{ social.url }}" class="social">
<img alt={{ social.name }} src={{ get_url(path="social_icons/" ~ social.icon ~ ".svg") }}>
</a>
{% endfor %}
</div>
</div>
<nav>
{% for menu in config.extra.menu | default(value=[]) %}
<a href={{ get_url(path=menu.url) }} style="margin-left: 0.5em">{{ menu.name }}</a>
{% endfor %}
{% if config.extra.theme | default(value="toggle") == "toggle" %}
|<a id="dark-mode-toggle" onclick="toggleTheme(); event.preventDefault();" href="#">
<img src={{ get_url(path="feather/sun.svg") }} id="sun-icon" style="filter: invert(1);" alt="Light" />
<img src={{ get_url(path="feather/moon.svg") }} id="moon-icon" alt="Dark" />
</a>
<!-- Inititialize the theme toggle icons -->
<script>updateItemToggleTheme()</script>
{% endif %}
</nav>
</header>