.navbar.navbar-default.navbar-fixed-top(ng-controller="headerController", headroom)
  .container
    .navbar-header
      button.navbar-toggle(type="button", data-toggle="collapse", data-target=".navbar-collapse")
        span.sr-only Toggle Navigation
        span.icon-bar
        span.icon-bar
        span.icon-bar
      a.navbar-brand(href="/") converse
    .navbar-collapse.collapse
      ul.nav.navbar-nav
        block mainMenu
          li(ng-class="{ active: isActive('/')}")
            a(href="/", title="Maki Homepage")
              i.glyphicon.glyphicon-home
              |  Home
          li(ng-class="{ active: isActive('/people')}")
            a(href="/people", title="People on this Maki, an example resource.")
              i.glyphicon.glyphicon-user
              |  People
          if (!user)
            li(ng-class="{ active: isActive('/register') }")
              a(href="/register") Sign Up »

      ul.nav.navbar-nav.navbar-right
        if (user)
          li(ng-class="{ active: isActive('/people/#{user.slug}')}")
            a(href="/people/#{user.slug}") #{user.username}
          li
            a(href="/logout") Log Out
        else
          li(ng-class="{ active: isActive('/login') }")
            a(href="/login") Log In