<div class="administration-overview">
  <nav mat-tab-nav-bar class="administration-overview__navbar" backgroundColor="#f5f5f5" >
    <a mat-tab-link class="administration-overview__navbar-links" routerLink="/taskana/administration/workbaskets" [active]="selectedTab == 'workbaskets'"
       (click)="selectedTab = 'workbaskets'">Workbaskets</a>
    <a mat-tab-link class="administration-overview__navbar-links" routerLink="/taskana/administration/classifications" [active]="selectedTab == 'classifications'"
       (click)="selectedTab = 'classifications'">Classifications</a>
    <a mat-tab-link class="administration-overview__navbar-links" routerLink="/taskana/administration/access-items-management"
       [active]="selectedTab == 'access-items-management'" (click)="selectedTab = 'access-items-management'">Access Items
      Management</a>
  </nav>
  <div class="administration-overview__domain">
    <mat-form-field appearance="legacy">
      <mat-select [value]="selectedDomain" matTooltip="Select domain">
        <mat-option *ngFor="let domain of domains" [value]="domain" (click)="switchDomain(domain)">
          {{domain? domain: 'MASTER DOMAIN'}}
        </mat-option>
      </mat-select>
    </mat-form-field>
  </div>
  <router-outlet></router-outlet>
</div>
