web-app-template/frontend/login-counter/src/app/app.component.html

<main [class]="themeService.themeName">
  <ng-container *ngIf="authService.isLoggedIn; else login">
    <app-header (isSidebarFullWidth)="themeService.setSideWidth($event)"></app-header>

    <section class="app">
      <div>
        <section class="sidebar" [style.width]="themeService.sidebarWidth">
          <app-sidebar [isSidebarOpen]="themeService.isSidebarOpen"></app-sidebar>
        </section>
      </div>
      <div class="component-wrapper">
        <section class="component">
          <router-outlet></router-outlet>
        </section>
      </div>
    </section>

    <app-footer></app-footer>
  </ng-container>


  <ng-template #login>
    <router-outlet></router-outlet>
  </ng-template>

  <app-spinner></app-spinner>
  <p-confirmDialog #cd key="confirmConfirmationDialog" [baseZIndex]="10000">
    <ng-template pTemplate="footer">
      <div class="wrapper-right btn-wrapper">
        <button pButton label="{{'dialog.abort' | translate}}" class="btn icon-btn danger-icon-btn" icon="pi pi-times-circle" (click)="cd.reject()"></button>
        <button pButton label="{{'dialog.confirm' | translate}}" class="btn" icon="pi pi-check-circle" (click)="cd.accept()"></button>
      </div>
    </ng-template>
  </p-confirmDialog>
  <p-toast></p-toast>
</main>