Header Block

 
<header class="header">
  <!-- Logo -->
  <a href="/" aria-label="Vona homepage" class="secondary">
    {{ template "logo" . }}
    <span>Vona</span>
  </a>

  <!-- Center Navigation e.g. Links -->
  <nav>
    <ul>
      <li>
        <a href="/docs/blocks" class="secondary"><small>Blocks</small></a>
      </li>
      <li>
        <a href="/docs/installation" class="secondary"><small>Docs</small></a>
      </li>
      <li>
        <a href="/docs/mission" class="secondary"><small>Mission</small></a>
      </li>
    </ul>
  </nav>

  <!-- Right Navigation e.g. CTA buttons -->
  <nav>
    <ul>
      <li>
        <a href="https://www.linkedin.com/in/tobiasgleiter/" target="_blank"
          >{{ template "linkedin-logo" . }}</a
        >
      </li>
      <li>
        <a href="https://github.com/bit8bytes/vona" target="_blank"
          >{{ template "github-logo" . }}</a
        >
      </li>
    </ul>
  </nav>

  <!-- Mobile Navigation -->
  <details>
    <summary aria-label="Toggle menu">☰</summary>
    <ul>
      <li><a href="/docs/blocks" class="secondary">Blocks</a></li>
      <li><a href="/docs/installation" class="secondary">Docs</a></li>
      <li><a href="/docs/mission" class="secondary">Mission</a></li>
      <hr />
      <li>
        <a href="https://www.linkedin.com/in/tobiasgleiter/" target="_blank"
          >Linkedin</a
        >
      </li>
      <li>
        <a href="https://github.com/bit8bytes/vona" target="_blank">GitHub</a>
      </li>
    </ul>
  </details>
</header>