src/app/app.component.html

<mat-toolbar color="primary" [class.mat-elevation-z1]="true">
  <span class="mat-body-strong ellipsis">P3X Angular HTTP Cache Interceptor v{{ version }}</span>
</mat-toolbar>

<nav mat-tab-nav-bar [tabPanel]="tabPanel"  backgroundColor="primary" color="accent" style=" border-top-left-radius: 6px; border-top-right-radius: 6px;">
    <a mat-tab-link
       *ngFor="let link of navLinks"
       [routerLink]="link.link"
       routerLinkActive #rla="routerLinkActive"
       [active]="rla.isActive">
      {{link.label}}
    </a>
  </nav>

<mat-tab-nav-panel #tabPanel>
    <mat-card style=" border-top-left-radius: 0px; border-top-right-radius: 0px; padding-top: 0;">
      <div>
        <a class="link-fix" mat-button color="accent" href="https://corifeus.com/angular-http-cache-interceptor" target="_blank">Corifeus P3X Angular HTTP Cache Interceptor</a>
      </div>
      <mat-divider></mat-divider>
      <div>
        <a class="link-fix" mat-button color="accent" href="https://github.com/patrikx3/angular-http-cache-interceptor" target="_blank">GitHub</a>
      </div>
      <mat-divider></mat-divider>
      <div>
        <a class="link-fix" mat-button color="accent" href="https://www.npmjs.com/package/p3x-angular-http-cache-interceptor" target="_blank">NpmJS</a>
      </div>
      <mat-divider></mat-divider>
      <br/>
      <div style="margin: 10px;">
        <router-outlet></router-outlet>
      </div>
    </mat-card>
  
  </mat-tab-nav-panel>
  <br/>
</div>

`/`	Focus search
`?`	Show this help
`Esc`	Unfocus input