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">
        <div class="dropdown">
          <button
            class="btn btn-link navbar-btn dropdown-toggle"
            type="button"
            id="dropdownMenuButton"
            data-toggle="dropdown"
            aria-haspopup="true"
            aria-expanded="false"
          >
            <fa name="server"></fa>
          </button>
          <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
            <a class="dropdown-item" routerLink="/admin/salutations">{{ 'Salutations.Link' | translate }}</a>
            <a class="dropdown-item" routerLink="/admin/communication-types">{{ 'CommunicationTypes.Link' | translate }}</a>
            <a class="dropdown-item" routerLink="/admin/person-types">{{ 'PersonTypes.Link' | translate }}</a>
            <a class="dropdown-item" routerLink="/admin/address-types">{{ 'AddressTypes.Link' | translate }}</a>
          </div>
        </div>
      </ng-template>
      <a class="btn btn-link navbar-btn" target="_blank" [href]="helpUrl">
        <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">
          {{ 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>