<nav id="sidebar">
  <div id="header-wrapper">
    <div id="header">
      {{ partial "logo.html" . }}
      <div class="searchbox">
        <label for="search-by"><i class="fa fa-search"></i></label>
        <input id="search-by" type="text" placeholder="Search Documentation" data-search-input="/search.json/query">
        <span data-search-clear=""><i class="fa fa-close"></i></span>
      </div>
    </div>
  </div>


  <div class="scroll-wrapper scrollbar-inner" style="position: relative;">
    <div class="scrollbar-inner scroll-content scroll-scrolly_visible" style="height: auto; margin-bottom: 0px; margin-right: 0px">
      <div class="highlightable">
        <ul class="topics">
          {{ $page := . }}
          {{ range $key , $value := .Site.Sections }}
          {{ if ne $key "" }}
          {{ $first := (index $value 0).Page }}

          <li class="dd-item {{ if eq $page.RelPermalink $first.RelPermalink }}active{{ end }} {{if in $page.RelPermalink $first.RelPermalink }}parent{{ end }}" data-nav-id="{{ $first.RelPermalink }}">
            <a href="{{ $first.RelPermalink }}">
              <span>
                {{ if isset $first.Params "icon" }}
                  {{ printf $first.Params.icon | safeHTML }}
                {{ end }}
                 {{ $first.Title }}
               </span>
            </a>
            <ul>
              {{ range $k, $p := .Pages }}
              {{ if gt $k 0 }}
                <li class="dd-item {{ if eq $page.RelPermalink $p.RelPermalink }}active{{ end }}" data-nav-id="{{ $p.RelPermalink }}">
                  <a href="{{ $p.RelPermalink }}">
                    <span>{{ $p.Title }}</span>
                  </a>
                </li>
              {{ end }}
              {{ end }}
            </ul>
          </li>
          {{ end }}
          {{ end }}
        </ul>
        <hr>
        <section id="footer">
          <p>Built with <i class="fa fa-heart"></i> from <a href="http://getgrav.org">Grav</a> and <a href="http://gohugo.io/">Hugo</a></p>
        </section>
      </div>
    </div>
  </div>
</nav>