header.html

<header id="header">
  <a class="logotype" href="/" aria-label="Active Bridge">
    {% include svgs/logo.html %}
  </a>
  <input id="menu-btn" class="menu-btn" type="checkbox">

  <ul class="header-navbar">
    <li>
      <label class="menu-icon" for="menu-btn">
        <span class="navicon"></span>
      </label>
      {% include svgs/navbar/bulb.html %}
      {% include svgs/navbar/more-bulb.html %}
    </li>

    {% for link in site.data.navbar.links %}
      <li class="header-navbar__item">
        {% if link.items %}
          <a href="{{ link.link }}" class="header-navbar__link" data-link="nav-link"> {{ link.page }} </a>
          <ul class="header-navbar__subitems">
            {% for subitem in link.items %}
              <li>
                <a href="{{ subitem.link }}" class="header-navbar__sub-link" data-link="nav-link"> {{ subitem.section }} </a>
              </li>
            {% endfor %}
          </ul>
        {% else %}
          <a href="{{ link.link }}" class="header-navbar__link" data-link="nav-link"> {{ link.page }} </a>
        {% endif %}
      </li>
    {% endfor %}
    <li class="header-navbar__link">
      <a href="/contacts" data-link="nav-link" class="header-navbar__link-contact">contact us</a>
    </li>

    <li class="mobile-only">
      <div class="header-navbar__close">
        <label for="menu-btn" class="menu-close-ico">⟶</label>
      </div>
    </li>
  </ul>
</header>