<nav class="navbar" role="navigation" aria-label="main navigation">
  <div class="navbar-brand">
    <a class="navbar-item title is-6" href="#" routerLink="/api">
      OAUTH2 / Azure AD / Angular
    </a>
  </div>
  <div class="navbar-menu">
    <div class="navbar-start">
      <a class="navbar-item" routerLink="/api" routerLinkActive="active">
        api
      </a>
      <a class="navbar-item" routerLink="/jwt" routerLinkActive="active">
        jwt token
      </a>
      <a class="navbar-item" routerLink="/session" routerLinkActive="active">
        session storage
      </a>
      <a class="navbar-item" routerLink="/environment" routerLinkActive="active">
        environment
      </a>
    </div>
    <div class="navbar-end">
      <div class="navbar-item">
        <div class="buttons">
          <div class="username"><a href="#" routerLink="/user">{{user}}</a></div>
          <a class="button is-small" (click)="login()" *ngIf="!authenticated">
            Sign In
          </a>
          <a class="button is-small" (click)="logout()" *ngIf="authenticated">
            Sign Out
          </a>
        </div>
      </div>
    </div>
  </div>
</nav>