<nav
  class="navbar navbar-expand-lg"
  ng-class="{'navbar-dark': isDarkMode}"
>
  <a class="navbar-brand" href="/">Anonymous <em>GitHub</em></a>
  <button
    class="navbar-toggler"
    type="button"
    data-toggle="collapse"
    data-target="#navbarSupportedContent"
    aria-controls="navbarSupportedContent"
    aria-expanded="false"
    aria-label="Toggle navigation"
  >
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto smooth-scroll">
      <li class="nav-item" ng-if="!user">
        <a class="nav-link" ng-class="{'active': path == '/'}" href="/">
          Home
        </a>
      </li>
      <li class="nav-item" ng-if="user">
        <a
          class="nav-link"
          ng-class="{'active': path == '/dashboard'}"
          href="/dashboard"
        >
          <i class="fas fa-th-large d-lg-none mr-1"></i>
          My work
        </a>
      </li>
      <li class="nav-item" ng-if="user">
        <a
          class="nav-link"
          ng-class="{'active':path == '/anonymize' || path == '/pull-request-anonymize'}"
          href="/anonymize"
        >
          <i class="fas fa-user-secret d-lg-none mr-1"></i>
          Anonymize
        </a>
      </li>
      <li class="nav-item" ng-if="user">
        <a
          class="nav-link"
          ng-class="{'active':path == '/conferences'}"
          href="/conferences"
        >
          <i class="fas fa-chalkboard-teacher d-lg-none mr-1"></i>
          Conferences
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" ng-class="{'active':path == '/faq'}" href="/faq"
          ><i class="fas fa-question-circle d-lg-none mr-1"></i>FAQ</a
        >
      </li>
      <li class="nav-item" ng-if="user && user.isAdmin">
        <a
          class="nav-link"
          ng-class="{'active':path.indexOf('/admin') === 0}"
          href="/admin/"
        >
          <i class="fas fa-cog d-lg-none mr-1"></i>
          Admin
        </a>
      </li>
    </ul>
    <ul class="navbar-nav">
      <li class="nav-item">
        <a
          class="nav-link nav-icon"
          target="_blank"
          href="https://github.com/tdurieux/anonymous_github/"
          title="GitHub repository"
          data-offset="30"
          ><i class="fab fa-github" aria-hidden="true"></i
        ></a>
      </li>
      <li class="nav-item d-none d-lg-block">
        <a
          class="nav-link"
          target="_blank"
          href="https://github.com/tdurieux/anonymous_github/issues/new"
          data-offset="30"
          >Report an issue
        </a>
      </li>

      <li class="nav-item" ng-if="!isDarkMode">
        <a class="nav-link nav-icon" href="#" ng-click="darkMode(true);" title="Dark mode">
          <i class="fas fa-moon"></i>
        </a>
      </li>

      <li class="nav-item" ng-if="isDarkMode">
        <a class="nav-link nav-icon" href="#" ng-click="darkMode(false);" title="Light mode">
          <i class="fas fa-sun"></i>
        </a>
      </li>

      <li class="nav-item" ng-if="!user">
        <a class="nav-link btn-signin" target="_self" href="/github/login" data-offset="30"
          ><i class="fab fa-github mr-1"></i>
          Sign in
        </a>
      </li>
      <li class="nav-item dropdown user-chip-wrap" ng-if="user">
        <a
          class="nav-link user-chip dropdown-toggle"
          href="#"
          id="navbarDropdownMenuLink"
          role="button"
          data-toggle="dropdown"
          aria-haspopup="true"
          aria-expanded="false"
        >
          <img
            ng-src="{{user.photo}}"
            ng-if="user.photo"
            width="22"
            height="22"
            class="rounded-circle"
          />
          <span class="user-chip-name">{{user.username}}</span>
        </a>
        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownMenuLink">
          <a class="dropdown-item" href="/profile">Default settings</a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="/api/user/logout" target="_self"
            >Logout</a
          >
        </div>
      </li>
    </ul>
  </div>
</nav>
<div
  class="navbar shadow generalMessage"
  ng-bind-html="generalMessage"
  ng-if="generalMessage"
></div>
