{{ "<!-- navigation -->" | safeHTML }}
<header class="sticky-top navigation">
  <div class="container">
    <!-- navbar -->
    <nav class="navbar navbar-expand-lg navbar-light">
      <a class="navbar-brand" href="{{ site.BaseURL }}"><img class="img-fluid" src="{{ site.Params.logo | absURL }}" alt="{{ site.Title }}"></a>
      <button class="navbar-toggler border-0" type="button" data-toggle="collapse" data-target="#navigation">
        <i class="ti-menu"></i>
      </button>

      <div class="collapse navbar-collapse text-center" id="navigation">
        <ul class="navbar-nav mx-auto">
          <li class="nav-item">
            <a class="nav-link" href="{{ site.BaseURL }}">{{ with site.Params.Home }} {{ . }} {{ end }}</a>
          </li>
          {{ range site.Menus.main }}
          {{ if .HasChildren }}
          <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              {{ .Name }}
            </a>
            <div class="dropdown-menu">
              {{ range .Children }}
              <a class="dropdown-item" href="{{ .URL | absURL }}">{{ .Name }}</a>
              {{ end }}
            </div>
          </li>
          {{ else }}
          <li class="nav-item">
            <a class="nav-link" href="{{ .URL | absURL }}">{{ .Name }}</a>
          </li>
          {{ end }}
          {{ end }}
        </ul>
      </div>
      <button class="cart snipcart-summary"><a href="" class="snipcart-checkout text-dark"><i class="ti-shopping-cart"></i><span class="badge badge-primary snipcart-items-count"></span></a></button>
    </nav>
  </div>
</header>
{{ "<!-- /navigation -->" | safeHTML }}