<div class="top-bar">
  <div class="top-bar-buttons">
    <a class="nav-button" routerLink="/jobs" routerLinkActive="active">JOB BOARD</a>
    @if (auth.isLoggedIn){
      <a class="nav-button" routerLink="/resumes" routerLinkActive="active">RESUMES</a>
      <a class="nav-button" routerLink="/company" routerLinkActive="active">COMPANIES</a>
    }
  </div>
  <a class="top-bar-logo" routerLink="">
    <img class="top-bar-logo" style="margin: 0;" src="img/logo-full.png" />
  </a>
  @if (auth.isLoggedIn){
    <div class="top-bar-buttons flex-right">
      <a class="nav-button nav-button-login" href="https://auth.mistox.com/"><span>{{ auth.loggedInUser.userName.toUpperCase() }}</span></a>
      <a class="nav-button nav-button-login" href="/api/account/logout"><span>LOGOUT</span></a>
    </div>
  } @else {
    <div class="top-bar-buttons flex-right">
      @if (devMode){
        <a class="nav-button nav-button-login" href="https://auth.mistox.com/account/login?returnURL=http://localhost:5000/"><span>Testing Login</span></a>
        <a class="nav-button nav-button-login" href="https://auth.mistox.com/account/register?returnURL=http://localhost:5000/"><span>REGISTER</span></a>
      } @else {
        <a class="nav-button nav-button-login" href="https://auth.mistox.com/account/login?returnURL=https://boredcareers.com/"><span>LOGIN</span></a>
        <a class="nav-button nav-button-login" href="https://auth.mistox.com/account/register?returnURL=https://boredcareers.com/"><span>REGISTER</span></a>
      }
    </div>
  }
</div>
<div class="content">
  <router-outlet></router-outlet>
</div>
<div class="bottom-bar">
  <div class="bottom-bar-buttons bottom-bar-float">
    <a class="nav-button-bottom bottom-bar-padding" href="https://auth.mistox.com/contact">CONTACT</a>
    <a class="nav-button-bottom bottom-bar-padding" href="https://auth.mistox.com/privacy">PRIVACY</a>
    <a class="nav-button-bottom bottom-bar-padding" href="https://auth.mistox.com/about">ABOUT</a>
  </div>
  <a class="bottom-bar-logo" href="https://mistox.com">
    <img src="img/mistox-logo.png" />
  </a>
  <div class="bottom-bar-buttons flex-right mistox-logo bottom-bar-float">
    <div class="bottom-bar-padding">
      <span>Mistox LLC</span>
    </div>
  </div>
</div>