I'm aware that the styles are very messy, I'm going to rewrite the whole _nav.scss to be more DRY later.
133 lines
5.5 KiB
HTML
133 lines
5.5 KiB
HTML
{%- set rel_attributes = macros_rel_attributes::rel_attributes() | trim -%}
|
|
|
|
<header id="site-nav">
|
|
<nav>
|
|
<a href="#main" id="main-content" tabindex="0">
|
|
{{ macros_translate::translate(key="skip_to_content", default="Skip to main content", language_strings=language_strings) }}
|
|
</a>
|
|
<ul>
|
|
<li id="home">
|
|
<a href="{{ get_url(path='/', lang=lang) }}"
|
|
{%- if current_url | default(value="/") | trim_end_matches(pat="/") | safe == get_url(path="/", lang=lang) | trim_end_matches(pat='/') | safe -%}
|
|
class="active"
|
|
{%- endif -%}>
|
|
<i class="icon"></i>
|
|
{{- config.title -}}
|
|
</a>
|
|
</li>
|
|
{%- for link in config.extra.nav.links %}
|
|
{%- if link.sublinks and link.sublinks | length > 0 -%}
|
|
<li>
|
|
<details>
|
|
<summary>
|
|
<i class="icon arrow"></i>
|
|
{{- macros_translate::translate(key=link.name, default=link.name, language_strings=language_strings) -}}
|
|
</summary>
|
|
<ul>
|
|
{%- for sublink in link.sublinks -%}
|
|
{%- if sublink.url is matching('https?://') %}
|
|
<li>
|
|
<a href="{{ sublink.url }}" rel="{{ rel_attributes }}"
|
|
{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == sublink.url | trim_end_matches(pat='/') | safe -%}
|
|
class="active"
|
|
{%- endif -%}>
|
|
{{- macros_translate::translate(key=sublink.name, default=sublink.name, language_strings=language_strings) -}}
|
|
</a>
|
|
</li>
|
|
{%- else %}
|
|
<li>
|
|
<a href="{{ get_url(path=sublink.url, lang=lang)}}"
|
|
{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == get_url(path=sublink.url, lang=lang) | trim_end_matches(pat='/') | safe -%}
|
|
class="active"
|
|
{%- endif -%}>
|
|
{{- macros_translate::translate(key=sublink.name, default=sublink.name, language_strings=language_strings) -}}
|
|
</a>
|
|
</li>
|
|
{%- endif %}
|
|
{%- endfor -%}
|
|
</ul>
|
|
</details>
|
|
</li>
|
|
{%- elif link.url is matching('https?://') %}
|
|
<li>
|
|
<a href="{{ link.url }}" rel="{{ rel_attributes }}"
|
|
{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == link.url | trim_end_matches(pat='/') | safe -%}
|
|
class="active"
|
|
{%- endif -%}>
|
|
{{- macros_translate::translate(key=link.name, default=link.name, language_strings=language_strings) -}}
|
|
</a>
|
|
</li>
|
|
{%- else %}
|
|
<li>
|
|
<a href="{{ get_url(path=link.url, lang=lang)}}"
|
|
{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == get_url(path=link.url, lang=lang) | trim_end_matches(pat='/') | safe -%}
|
|
class="active"
|
|
{%- endif -%}>
|
|
{{- macros_translate::translate(key=link.name, default=link.name, language_strings=language_strings) -}}
|
|
</a>
|
|
</li>
|
|
{%- endif %}
|
|
{%- endfor -%}
|
|
{%- if config.build_search_index %}
|
|
<li id="search" class="circle">
|
|
<button onclick="toggleSearch()" title="{{ macros_translate::translate(key='search', default='Search', language_strings=language_strings) }}">
|
|
<i class="icon"></i>
|
|
</button>
|
|
</li>
|
|
{%- endif %}
|
|
{%- if config.languages | length > 0 %}
|
|
{%- include "partials/language_switcher.html" %}
|
|
{%- endif -%}
|
|
{%- if config.extra.nav.show_theme_switcher %}
|
|
<li id="theme-switcher" class="circle">
|
|
<details>
|
|
<summary title="{{ macros_translate::translate(key='theme', default='Theme', language_strings=language_strings) }}">
|
|
<i class="icon"></i>
|
|
</summary>
|
|
<ul>
|
|
<li>
|
|
<button id="theme-light" onclick="switchTheme('light')" title="{{ macros_translate::translate(key='theme_light', default='Switch to light theme', language_strings=language_strings) }}">
|
|
<i class="icon"></i>
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button id="theme-dark" onclick="switchTheme('dark')" title="{{ macros_translate::translate(key='theme_dark', default='Switch to dark theme', language_strings=language_strings) }}">
|
|
<i class="icon"></i>
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button id="theme-system" onclick="switchTheme('system')" title="{{ macros_translate::translate(key='theme_system', default='Use system theme', language_strings=language_strings) }}">
|
|
<i class="icon"></i>
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</details>
|
|
</li>
|
|
{%- endif %}
|
|
{%- if config.generate_feeds and config.extra.nav.show_feed %}
|
|
<li id="feed" class="circle">
|
|
<a href="{{ get_url(path=config.feed_filenames[0], lang=lang) }}" title="{{ macros_translate::translate(key='feed', default='Feed', language_strings=language_strings) }}">
|
|
<i class="icon"></i>
|
|
</a>
|
|
</li>
|
|
{%- endif %}
|
|
{%- if config.extra.source_url and config.extra.nav.show_repo %}
|
|
<li id="repo" class="circle">
|
|
<a href="{{ config.extra.source_url }}" title="{{ macros_translate::translate(key='repo', default='Repository', language_strings=language_strings) }}">
|
|
<i class="icon"></i>
|
|
</a>
|
|
</li>
|
|
{%- endif %}
|
|
</ul>
|
|
</nav>
|
|
{%- if config.build_search_index %}
|
|
<div id="search-container">
|
|
<label for="search-bar" class="hidden">
|
|
{{- macros_translate::translate(key="search", default="Search", language_strings=language_strings) -}}
|
|
</label>
|
|
<input id="search-bar" placeholder="{{ macros_translate::translate(key='search_for', default='Search for', language_strings=language_strings) }}…" autocomplete="off" type="search" disabled>
|
|
<div id="search-results"></div>
|
|
</div>
|
|
{%- endif %}
|
|
</header>
|