<header class="header">
  <div class="container">
    <a href="/" class="title">
      <h1>Crémeaux</h1>
    </a>

    <nav class="nav">
      {{ $currentPage := . }}
      <ul class="menu">
        {{ range .Site.Menus.main }}
          <li class="{{if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }}active{{ end }} {{ .Pre }}">
          <a href="{{ .URL }}" class="{{ .Identifier }}">{{ .Name }}</a>
          {{ if .HasChildren }}
          <ul class="sousmenu {{if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }}active{{ end }}">
              {{ range .Children }}
              <li class="{{ if $currentPage.IsMenuCurrent "main" . }}active{{ end }} {{ .Pre }}">
              <a href="{{ .URL }}">{{ .Name }}</a>
              </li>
              {{ end }}
          </ul>
          {{ end }}
          </li>
        {{ end }}
      </ul>
    </nav>

    <button class="nav-button" type="button" role="button" aria-label="open/close navigation"><i>Menu</i></button>
  </div>
</header>
