buildsomething/templates/_macros.html
2024-11-10 15:23:31 +01:00

88 lines
2.4 KiB
HTML

{% macro render_header(path) %}
{% set root = get_section(path="_index.md") %}
<a href="{{ root.permalink | safe }}">
<div class="logo">
<img src="{{ get_url(path=config.extra.juice_logo_path) }}" alt="logo">
{{ config.extra.juice_logo_name }}
</div>
</a>
<nav>
{% if config.extra.juice_extra_menu %}
{% for menu in config.extra.juice_extra_menu %}
<a class="nav-item subtitle-text" href="{{ menu.link | safe }}">{{ menu.title }}</a>
{% endfor %}
{% endif %}
{% for page in root.pages %}
{% if lang == "en" %}
<a class="nav-item subtitle-text" href="{{ page.permalink | safe }}">{{ page.title }}</a>
{% else %}
<a class="nav-item subtitle-text" href="/{{lang}}{{ page.path }}">{{ page.title }}</a>
{% endif %}
{% endfor %}
{% for path in root.subsections %}
{% set child = get_section(path=path) %}
{% if lang == "en"%}
<a class="nav-item subtitle-text" href="{{ child.permalink | safe }}">{{ child.title }}</a>
{% else %}
<a class="nav-item subtitle-text" href="/{{lang}}{{ child.path }}">{{ child.title }}</a>
{% endif %}
{% endfor %}
{% if lang == "en"%}
<a class="nav-item subtitle-text" href="/sv{{ path }}"><img alt="swedish" class="flag"
src="/flag-for-sweden-svgrepo-com.svg"></a>
{% else %}
<a class="nav-item subtitle-text" href="{{ path }}"><img alt="english" class="flag"
src="/flag-for-united-kingdom-svgrepo-com.svg"></a>
{% endif %}
<div class='toggle-dark'>
<label>
<input type='checkbox' _="on click
log(the first <body/>) then
if me.checked
log('checked')
add .dark to the closest <body/>
else
remove .dark from the closest <body/>
end
end
on load
if (the first <body/> match .dark)
log('loaded as dark') then
set me.checked to true then
log(me)
">
<span class='slider'></span>
</label>
</div>
<!-- if i am <:checked/> -->
</nav>
{% endmacro render_header %}
{% macro render_toc(toc) %}
<div class="toc">
<div class="toc-sticky">
{% for h in toc %}
<div class="toc-item">
<a class="subtext" href="{{h.permalink | safe}}">{{ h.title }}</a>
</div>
{% if h.children %}
{% for h2 in h.children %}
<div class="toc-item-child">
<a class="subtext" href="{{h2.permalink | safe}}"><small>- {{ h2.title }}</small></a>
</div>
{% endfor %}
{% endif %}
{% endfor %}
</div>
</div>
{% endmacro render_toc %}