<div id="header-post">
  <a id="menu-icon" href="#"><i class="fas fa-bars fa-lg"></i></a>
  <a id="menu-icon-tablet" href="#"><i class="fas fa-bars fa-lg"></i></a>
  <a id="top-icon-tablet" href="#" onclick="$('html, body').animate({ scrollTop: 0 }, 'fast');" style="display:none;" aria-label="Top of Page"><i class="fas fa-chevron-up fa-lg"></i></a>
  <span id="menu">
    <span id="nav">
      <ul>
        {{ range .Site.Menus.main }} 
        <li><a href="{{ .URL }}">{{ .Name }}</a></li>
        {{ end }}
      </ul>
    </span>
    <br/>
    <span id="actions">
      <ul>
        {{ if .Prev }}
        <li>
          <a class="icon" href=" {{ .Prev.Permalink }}" aria-label="Previous">
            <i class="fas fa-chevron-left" aria-hidden="true" onmouseover="$('#i-prev').toggle();" onmouseout="$('#i-prev').toggle();"></i>
          </a>
        </li>
        {{ end }}
        {{ if .Next }}
        <li>
          <a class="icon" href="{{ .Next.Permalink }}" aria-label="Next">
            <i class="fas fa-chevron-right" aria-hidden="true" onmouseover="$('#i-next').toggle();" onmouseout="$('#i-next').toggle();"></i>
          </a>
        </li>
        {{ end }}
        <li>
          <a class="icon" href="#" onclick="$('html, body').animate({ scrollTop: 0 }, 'fast');" aria-label="Top of Page">
            <i class="fas fa-chevron-up" aria-hidden="true" onmouseover="$('#i-top').toggle();" onmouseout="$('#i-top').toggle();"></i>
          </a>
        </li>
        <li>
          <a class="icon" href="#" aria-label="Share">
            <i class="fas fa-share-alt" aria-hidden="true" onmouseover="$('#i-share').toggle();" onmouseout="$('#i-share').toggle();" onclick="$('#share').toggle();return false;"></i>
          </a>
        </li>
      </ul>
      <span id="i-prev" class="info" style="display:none;">Previous post</span>
      <span id="i-next" class="info" style="display:none;">Next post</span>
      <span id="i-top" class="info" style="display:none;">Back to top</span>
      <span id="i-share" class="info" style="display:none;">Share post</span>
    </span>
    <br/>
    <div id="share" style="display: none">
      {{ .Scratch.Set "icon_class_name" ""}}
      {{ partial "share.html" . }}
    </div>
    {{ if not .Site.Params.tocInline }}
    <div id="toc">
      {{ .TableOfContents }}
    </div>
    {{ end }}
  </span>
</div>
