header.html

<!-- The page title -->
<nav class="top-nav">
  <div class="container">
    <div class="nav-wrapper">
      <a class="page-title">
        {% if page.title == "Home" %}{{ site.title }}{% else %}{{ page.title }}{% endif %}
      </a>
    </div>
  </div>
</nav>

<div class="container">
  <a href="#" data-activates="kwarc-nav" class="button-collapse top-nav full hide-on-large-only">
    <i class="material-icons">menu</i>
  </a>
</div>

<!-- The menu -->
<ul id="kwarc-nav" class="side-nav fixed">
  <li>
    <div class="userView">
      <a href="{{ site.baseurl }}/"><img src="{{ site.baseurl }}/public/kwarc_logo.svg"></a>
    </div>
  </li>
  
  {% assign url_parts = page.url | split: '/' %}
  {% assign base_url = url_parts | last %}
  {% assign sorted_pages = site.pages | sort:"menu_order" %}
  
  {% for node in site.menu %}
  
    <li><div class="divider"></div></li>
    <li><a class="subheader">{{ node.title }}</a></li>
    
    {% for sub in sorted_pages %}
      
      {% assign sub_parts = sub.url | split: '/' %}
      {% assign sub_url = sub_parts | last %}
      {% assign sub_folder = sub_parts[1] %}
      
      {% if sub_folder == node.folder %}
        <li>
          <a class="waves-effect {% if sub_url == base_url %}active{% endif %}" href="{{ sub.url }}">
            {% if sub.menu_title %}
              {{ sub.menu_title }}
            {% else %}
              {{ sub.title }}
            {% endif %}
          </a>
        </li>
      {% endif %}
    {% endfor %}
  {% endfor %}
  
  <li><div class="divider"></div></li>
  <li><a class="waves-effect" href="{{ site.baseurl }}/news/">News</a></li>
  <li><a class="waves-effect" href="{{ site.baseurl }}/contact/">Contact</a></li>
</ul>