header.njk 1.86 KB
Newer Older
epsi sayidina's avatar
epsi sayidina committed
1 2

  <nav role="navigation" aria-label="main navigation"
epsi sayidina's avatar
epsi sayidina committed
3
       class="navbar is-fixed-top is-dark maxwidth"
epsi sayidina's avatar
epsi sayidina committed
4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65
       id="navbar-vue-app">
    <div class="navbar-brand">
      <a class="navbar-item"
         href="{{ "/" | url }}">
        <img src="{{ "/assets/images/logo-gear.png" | url }}" 
           alt="Home" />
      </a>
      <a class="navbar-item"
         href="{{ "/pages/" | url }}">
        Blog
      </a>

      <a role="button" class="navbar-burger burger" 
         aria-label="menu" aria-expanded="false" data-target="navbarBulma"
         @click="isOpen = !isOpen" v-bind:class="{'is-active': isOpen}">
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
      </a>
    </div>

    <div id="navbarBulma" class="navbar-menu"
         v-bind:class="{'is-active': isOpen}">
      <div class="navbar-start">
        <div class="navbar-item has-dropdown is-hoverable">
          <a class="navbar-link">
            Archives
          </a>

          <div class="navbar-dropdown">
            <a class="navbar-item"
               href="{{ "/tags/" | url }}">
              By Tags
            </a>
            <hr class="navbar-divider">
            <a class="navbar-item"
               href="{{ "#" | url }}">
              By Chronology
            </a>
          </div>
        </div>

        <a class="navbar-item"
           href="{{ "/pages/about/" | url }}">
          About
        </a>
      </div>

      <div class="navbar-end">
        <form class="is-marginless" action="/pages/search/" method="get">
        <div class="navbar-item">
          <input class="" type="text" name="q"
            placeholder="Search..." aria-label="Search">
          &nbsp;
          <button class="button is-light" 
            type="submit">Search</button>
        </div>
        </form>
      </div>

    </div>
  </nav>