<header {% if config.extra.blur_effect %} class="blur" {% endif %}>
  <div id="header-wrapper">
    <nav>
      <a href="/">{{ config.extra.blog_name }}</a>
      {% if config.extra.sections | length > 1 %}
        <button id="toggler" class="separator" aria-label="toggle expand">{{ config.extra.nav_separator }}</button>
      {% else %}
        <span class="separator">{{ config.extra.nav_separator }}</span>
      {% endif %}
      {% if config.extra.sections | length > 1 %}
        <span class="wrap left fold">{{ config.extra.nav_wrapper_left }}</span>
        {% set_global is_taxonomies_path = false %}
        {% for taxonomy in config.taxonomies %}
          {% if current_path is starting_with("/" ~ taxonomy.name)%}
            {% set_global is_taxonomies_path = true %}
          {% endif %}
        {% endfor %}
        {% set site_sections = config.extra.sections | filter(attribute="is_external", value=false) %}
        {% for section in site_sections %}
          {% set should_fold = false %}
          {% if is_taxonomies_path and section.path == config.extra.blog_section_path %}
            {% set should_fold = false %}
          {% elif not current_path is starting_with(section.path) %}
            {% set should_fold = true %}
          {% endif %}
          <a href="{{ section.path }}" {% if should_fold %}class="fold"{% endif %}>{{ section.name }}</a>
          {% if not loop.last %}<span class="wrap-separator fold">{{ config.extra.nav_wrapper_separator }}</span>{% endif %}
        {% endfor %}
        <span class="wrap right fold">{{ config.extra.nav_wrapper_right }}</span>
      {% else %}
        {% set section = config.extra.sections | first %}
        <a href="{{ section.path }}">{{ section.name }}</a>
      {% endif %}
    </nav>
    <div id="btns">
      {% if config.extra.blog_section_path is defined %}
      {% set blog_section_path = config.extra.blog_section_path %}
      {% endif %}

      {% if blog_section_path is defined and section.path is starting_with(blog_section_path) %}
      {% set rss_icon = load_data(path="static/icon/rss.svg") %}
      {% if section.generate_feed -%}
      <a href="{{ blog_section_path }}/{{ config.feed_filenames }}" aria-label="rss feed">{{ rss_icon | safe }}</a>
      {% elif config.generate_feed -%}
      <a href="/{{ config.feed_filenames }}" aria-label="rss feed">{{ rss_icon | safe }}</a>
      {% endif %}
      {% endif %}

      {% for link in config.extra.links -%}
      <a href="{{ link.url }}" aria-label="{{ link.name }}" target="_blank" rel='noreferrer noopener'>
        {% set icon_path = "static/icon/" ~ link.icon ~ ".svg" %}
        {% set icon = load_data(path=icon_path) %}
        {{ icon | safe }}
      </a>
      {% endfor %}

      {% set moon_icon = load_data(path="static/icon/moon.svg") %}
      {% set sun_icon = load_data(path="static/icon/sun.svg") %}
      <button id="theme-toggle" aria-label="theme switch" data-moon-icon="{{ moon_icon }}" data-sun-icon="{{ sun_icon }}">
        {{ moon_icon | safe }}
      </button>

      {% if blog_section_path is defined and section.path is starting_with(blog_section_path) %}
      {% set toc_icon = load_data(path="static/icon/toc.svg") %}
      {% if page.extra.toc is defined %}{% set show_toc = page.extra.toc %}{% else %}{% set show_toc = config.extra.toc %}{% endif %}
      {% if show_toc and page %}
      <button id="toc-toggle" aria-label="table of content">
        {{ toc_icon | safe }}
      </button>
      {% endif %}
      {% endif %}
    </div>
  </div>
</header>