navbar.html

<ul>
  {% for item in site.data.navbar %}

  {% comment %}
  Assign item state "active" if we are on the item or on one of its subitems'
  pages
  {% endcomment %}

  {% assign item_state = "" %}
  {% if item.url == page.url %}
    {% assign item_state = "active" %}
  {% else %}
    {% for subitem in item.sub %}
      {% if page.url == subitem.url %}
        {% assign item_state = "active" %}
        {% break %}
      {% endif %}
    {% endfor %}
  {% endif %}

  <li>
    {% if item.url %}
    <a href="{{item.url}}">{{item.text}}</a>
    {% else %}
    <label class="{{item_state}}" for="drop-{{forloop.index}}">{{item.text}}</label>
    <input id="drop-{{forloop.index}}" type="checkbox" {% if item_state == "active" %}checked{% endif %}>
    <ul>
      {% for subitem in item.sub %}

      {% comment %}
      Assign subitem state "active" if we are on the subitem page
      {% endcomment %}

      {% if subitem.url == page.url %}
        {% assign subitem_state = "active" %}
      {% else %}
        {% assign subitem_state = "" %}
      {% endif %}

      <li>
        <a href="{{subitem.url}}"
          class={{subitem_state}}>
          {{subitem.text}}
          {% if subitem.external %}
          <img src="{{site.baseurl}}/assets/images/link-external.png">
          {% endif %}
        </a>
      </li>
      {% endfor %}
    </ul>
    {% endif %}
  </li>
  {% endfor %}
</ul>