mirror of
https://github.com/Tzahi12345/YoutubeDL-Material.git
synced 2026-03-18 02:30:55 +03:00
42 lines
2.5 KiB
HTML
42 lines
2.5 KiB
HTML
<div [style.background]="postsService.theme ? postsService.theme.background_color : null" style="width: 100%; height: 100%;">
|
|
<div>
|
|
<mat-toolbar color="primary" class="top">
|
|
<div class="flex-row" width="100%" height="100%">
|
|
<div class="flex-column" style="text-align: left; margin-top: 1px;">
|
|
<button class="no-outline" *ngIf="router.url.split(';')[0] !== '/player'" mat-icon-button aria-label="Toggle side navigation" (click)="toggleSidenav()"><mat-icon>menu</mat-icon></button>
|
|
<button (click)="goBack()" *ngIf="router.url.split(';')[0] === '/player'" mat-icon-button><mat-icon>arrow_back</mat-icon></button>
|
|
</div>
|
|
<div class="flex-column" style="text-align: center; margin-top: 5px;">
|
|
<div>{{topBarTitle}}</div>
|
|
</div>
|
|
<div class="flex-column" style="text-align: right; align-items: flex-end;">
|
|
<button [matMenuTriggerFor]="menuSettings" mat-icon-button><mat-icon>more_vert</mat-icon></button>
|
|
<mat-menu #menuSettings="matMenu">
|
|
<button (click)="$event.stopPropagation();" *ngIf="allowThemeChange" mat-menu-item>
|
|
<mat-icon>{{(postsService.theme.key === 'default') ? 'brightness_5' : 'brightness_2'}}</mat-icon>
|
|
<span>Dark</span>
|
|
<mat-slide-toggle class="theme-slide-toggle" [checked]="postsService.theme.key === 'dark'" (change)="flipTheme()"></mat-slide-toggle>
|
|
</button>
|
|
<button (click)="openSettingsDialog()" mat-menu-item>
|
|
<mat-icon>settings</mat-icon>
|
|
<span>Settings</span>
|
|
</button>
|
|
</mat-menu>
|
|
</div>
|
|
</div>
|
|
</mat-toolbar>
|
|
</div>
|
|
<div style="height: calc(100% - 64px)">
|
|
<mat-sidenav-container style="height: 100%">
|
|
<mat-sidenav #sidenav>
|
|
<mat-nav-list>
|
|
<a mat-list-item (click)="sidenav.close()" routerLink='/home'>Home</a>
|
|
<a mat-list-item (click)="sidenav.close()" routerLink='/subscriptions'>Subscriptions</a>
|
|
</mat-nav-list>
|
|
</mat-sidenav>
|
|
<mat-sidenav-content [style.background]="postsService.theme ? postsService.theme.background_color : null">
|
|
<router-outlet></router-outlet>
|
|
</mat-sidenav-content>
|
|
</mat-sidenav-container>
|
|
</div>
|
|
</div> |