definma-ui/src/app/app.component.html

<rb-full-header id="top">
  <nav *rbMainNavItems>
    <a routerLink="/home" routerLinkActive="active" rbLoadingLink>Home</a>
    <a routerLink="/prediction" routerLinkActive="active" rbLoadingLink *ngIf="login.hasPrediction">Prediction</a>
    <a routerLink="/models" routerLinkActive="active" rbLoadingLink *ngIf="login.isLevel.dev">Models</a>
    <a routerLink="/samples" routerLinkActive="active" rbLoadingLink *ngIf="login.isLevel.read">Samples</a>
    <a routerLink="/materials" routerLinkActive="active" rbLoadingLink *ngIf="login.isLevel.dev">Materials</a>
    <a routerLink="/templates" routerLinkActive="active" rbLoadingLink *ngIf="login.isLevel.dev">
      Templates
    </a>
    <a routerLink="/changelog" routerLinkActive="active" rbLoadingLink *ngIf="login.isLevel.dev">Changelog</a>
    <a routerLink="/users" routerLinkActive="active" rbLoadingLink *ngIf="login.isLevel.admin">Users</a>
    <a routerLink="/documentation" routerLinkActive="active" rbLoadingLink>Documentation</a>
  </nav>

  <ng-container *ngIf="isDocumentation">
    <nav *rbSubNavItems>
      <a routerLink="/documentation" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">General</a>
      <a routerLink="/documentation/architecture" routerLinkActive="active">Architecture</a>
      <a routerLink="/documentation/database" routerLinkActive="active">Database</a>
      <a routerLink="/documentation/models" routerLinkActive="active">Models</a>
    </nav>
  </ng-container>

  <nav *rbMetaNavItems>
    <span class="rb-ic rb-ic-question-frame clickable space-above" (click)="help()"></span>
  </nav>

  <ng-container *ngIf="login.isLoggedIn">
    <nav *rbActionNavItems>
      <a href="javascript:"  [rbPopover]="userPopover" [anchor]="popoverAnchor">
        {{login.username}} <span class="rb-ic rb-ic-my-brand-frame" #popoverAnchor></span></a>
    </nav>
    <ng-template #userPopover let-close="close">
      <div class="spacing">
        <a routerLink="/settings" (click)="close()"><span class="rb-ic rb-ic-settings"></span>&nbsp;&nbsp;Settings</a>
        <button type="button" class="rb-btn rb-primary" (click)="logout()">Logout</button>
      </div>
    </ng-template>
  </ng-container>

  <div *rbSubBrandHeader>
    <rb-icon-button icon="bug" mode="secondary" class="space-right" [rbModal]="bugModal">
      Bug
    </rb-icon-button>
    <ng-template let-close="close" #bugModal>
      <h3>Report a bug</h3>
      <rb-form-textarea class="bug-textarea" label="What did you do?" [(ngModel)]="bugReport.do"></rb-form-textarea>
      <rb-form-textarea class="bug-textarea" label="What did not work?" [(ngModel)]="bugReport.work"></rb-form-textarea>
      <a [href]="bugReportContent()">
        <rb-icon-button icon="mail" mode="primary" (mouseup)="closeBugReport(close)">Send report</rb-icon-button>
      </a>
    </ng-template>
    <span class="dev-label" *ngIf="devMode">DEVELOPMENT</span>
    DeFinMa
  </div>
</rb-full-header>

<div class="container">
  <router-outlet></router-outlet>
</div>

<rb-icon-button icon="up" mode="primary" iconOnly (click)="toTheTop()" *ngIf="window.scrollY > 300" class="to-the-top">
</rb-icon-button>

<rb-footer-nav>
  <span class="copyright">
    CR/APS1 and CR/ANA1 2020
  </span>
  <nav>
    <a [href]="'mailto:' + d.contact.mail">Contact</a>
  </nav>
</rb-footer-nav>