`views/partials/header.ejs`

27 lines
<header class="site-header" data-transparent="true">
  <a class="brand" href="/" aria-label="Butlr home">
    <span class="brand-mark" aria-hidden="true">🎩</span>
    <span class="brand-name">Butlr</span>
  </a>

  <button id="hamburger" class="hamburger" type="button"
          aria-label="Open menu" aria-expanded="false" aria-controls="site-nav">
    <span></span><span></span><span></span>
  </button>

  <nav id="site-nav" class="site-nav" aria-hidden="true">
    <button id="hamburger-close" class="hamburger-close" type="button" aria-label="Close menu">×</button>
    <a href="/">Home</a>
    <a href="/new">Start a call</a>
    <a href="/calls">Your calls</a>
    <a href="/calendar">Calendar</a>
    <a href="/how-it-works">How it works</a>
    <button id="theme-toggle" class="theme-toggle" type="button" aria-label="Toggle dark / light theme">
      <span class="theme-toggle-sun">☀</span>
      <span class="theme-toggle-moon">☾</span>
      <span class="theme-toggle-label">Theme</span>
    </button>
  </nav>
  <div id="nav-scrim" class="nav-scrim" hidden></div>
</header>