{{ script('scripts/components/navbar.js') }}
<nav class="{{ isLanding ? 'darken' : '' }} navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand">
      <a class="navbar-item" href="/">
        {{--  <img src="https://bulma.io/images/bulma-logo.png" width="112" height="28">  --}}
        <strong>Seepur</strong>
      </a>

      <a id="menu-button" role="button" class="navbar-burger burger {{ isLanding ? 'has-text-light' : '' }} " aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
        <span aria-hidden="true"></span>
      </a>
    </div>

    <div id="nav-menu" class="navbar-menu">
      <div class="navbar-start">
        <a class="navbar-item">
          Home
        </a>

        <a class="navbar-item">
          About
        </a>

      </div>

      <div class="navbar-end">
          @loggedIn
          <div class="navbar-item has-dropdown is-hoverable is-dark">
            <a class="navbar-link">
              {{auth.user.name}}
            </a>

            <div class="navbar-dropdown">
              <a class="navbar-item">
                Settings
              </a>
              <a class="navbar-item" href="/logout">
                Logout
              </a>
            </div>
          </div>
          @else
          <div class="navbar-item">
            <div class="buttons">
              <a class="button is-primary" href='/register'>
                <strong>Sign up</strong>
              </a>
              <a class="button is-light" href='/login'>
                Log in
              </a>
            </div>
          </div>
          @endloggedIn
      </div>
    </div>
  </nav>