1efb0330e3
The `initialize-theme.js` script takes care of the following: 1. If there is a stored theme value in the localStorage, set the theme based on that value. 2. If there is no stored theme value, check the user's system preference (dark or light) and set the theme accordingly. The new `main.js` takes care of the actual theme switching and listening to system preference changes (if the user has not manually set a theme). Now the icons are stored in CSS, and are set according to the current theme. This allows for having different icons that dynamically switch. Additionally, wraps social and navigation elements in ul/li. Fixes #76
21 lines
945 B
HTML
21 lines
945 B
HTML
<footer>
|
|
<section>
|
|
<nav class="socials nav-navs">
|
|
{%- if config.extra.socials %}
|
|
<ul>
|
|
{% for social in config.extra.socials %}
|
|
<li>
|
|
<a rel="noopener noreferrer" target="_blank" class="nav-links no-hover-padding social" href={{ social.url | safe | replace(from="$BASE_URL", to=config.base_url) }}>
|
|
<img alt={{ social.name }} title={{ social.name }} src="{{config.base_url}}/social_icons/{{ social.icon }}.svg">
|
|
</a>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% endif %}
|
|
</nav>
|
|
<div class="credits">
|
|
<small>Powered by <a href="https://www.getzola.org" target="_blank">Zola</a> & <a href="https://github.com/welpo/tabi" target="_blank">tabi</a></small>
|
|
</div>
|
|
</section>
|
|
</footer>
|