33 lines
2.3 KiB
HTML
33 lines
2.3 KiB
HTML
<mat-toolbar *ngIf="!hide" [@expandDown]="!hide" class="bg-primary">
|
|
<mat-icon *ngIf="mobile" class="mr-2" (click)="open = !open">menu</mat-icon>
|
|
<img src="assets/icon.png" class="mr-2" height="24px" width="auto">
|
|
<span>
|
|
<span style="font-weight: 500;">Home Front</span>
|
|
<small class="text-muted ml-2">v{{environment.version}}</small>
|
|
</span>
|
|
</mat-toolbar>
|
|
<mat-drawer-container [hasBackdrop]="false" style="height: calc(100vh - 64px)">
|
|
<mat-drawer class="bg-primary" [mode]="mobile ? 'push' : 'side'" [opened]="open" [disableClose]="!mobile" [autoFocus]="false">
|
|
<mat-nav-list class="p-0">
|
|
<mat-divider></mat-divider>
|
|
<a mat-list-item routerLink="dashboard" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">insert_chart</mat-icon> Dashboard</span></a>
|
|
<mat-divider></mat-divider>
|
|
<a mat-list-item routerLink="battery" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">{{batteryService.icon}}</mat-icon> Power Wall</span></a>
|
|
<mat-divider></mat-divider>
|
|
<a mat-list-item routerLink="weather" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><i [class]="'mr-2 scale-150 wi wi-fw ' + weatherService.icon"></i> Weather</span></a>
|
|
<mat-divider></mat-divider>
|
|
<a mat-list-item routerLink="security" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">security</mat-icon> Security</span></a>
|
|
<mat-divider></mat-divider>
|
|
<a mat-list-item routerLink="settings" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">settings</mat-icon> Settings</span></a>
|
|
<mat-divider></mat-divider>
|
|
<a mat-list-item (click)="logout()"><span class="p-3 pl-0 mr-5" style="color: darkred"><mat-icon class="mr-2">logout</mat-icon> Logout</span></a>
|
|
<mat-divider></mat-divider>
|
|
</mat-nav-list>
|
|
</mat-drawer>
|
|
<mat-drawer-content class="bg-secondary text-white" [ngClass]="{'p-4': !hide}" (click)="open = (mobile && open) ? false : open" style="position: relative">
|
|
<main class="h-100" [@routerTransition]="getState(o)">
|
|
<router-outlet #o="outlet"></router-outlet>
|
|
</main>
|
|
</mat-drawer-content>
|
|
</mat-drawer-container>
|