src/app/shared/components/header/header.component.html

<!-- /********************************************************************************
* Copyright (c) 2020 Contributors to the Eclipse Foundation
*
* See the NOTICE file(s) distributed with this work for additional
* information regarding copyright ownership.
*
* This program and the accompanying materials are made available under the
* terms of the Eclipse Public License v. 2.0 which is available at
* http://www.eclipse.org/legal/epl-2.0.
*
* SPDX-License-Identifier: EPL-2.0
********************************************************************************/ -->
<nav class="navbar navbar-default navbar-fixed-top masthead overview-navbar" role="banner">
  <div class="container-fluid">
    <div class="navbar-header" (click)="navigateToOverview()">
      <a class="navbar-brand">
        <span class="open">Open</span>
        <span class="konsequenz">KONSEQUENZ</span>
      </a>
    </div>
    <div class="navbar-right" style="display: inline-flex;">
      <button type="button" class="btn btn-link navbar-btn" (click)="navigateToOverview()">
        <fa name="home"></fa>
      </button>
      <ng-template visibleByRight [onlyForAdmin]="true">
        <button type="button" class="btn btn-link navbar-btn" (click)="navigateToAdminPage()">
          <fa name="server"></fa>
        </button>
      </ng-template>
      <a class="btn btn-link navbar-btn" href="./assets/userDocumentation/userDocumentation.html" title="Hilfe" target="_blank">
        <fa name="question-circle"></fa>
      </a>
      <span class="divider"></span>
      <div class="dropdown-open nav-user nav-overview-user">
        <a class="btn btn-logout dropdown-toggle" style="min-width: 160px;" data-toggle="dropdown" href="#" aria-expanded="true">
          <span class="fa fa-user fa-fw"></span>
          {{ userName }}
          <span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
          <li class="dropdown-item"><a routerLink="/logout" (click)="logout.emit()">Abmelden</a></li>
        </ul>
      </div>
    </div>
  </div>
  <app-version-info class="version-info-simple"></app-version-info>
</nav>