red-ui/apps/red-ui/src/app/screens/base-screen/base-screen.component.html
2020-10-19 10:41:55 +03:00

70 lines
3.1 KiB
HTML

<div class="red-top-bar">
<div class="top-bar-row">
<div class="menu left visible-lt-lg">
<button [matMenuTriggerFor]="menuNav" mat-flat-button>
<mat-icon svgIcon="red:menu"></mat-icon>
</button>
<mat-menu #menuNav="matMenu">
<button mat-menu-item routerLink="/ui/projects"
translate="top-bar.navigation-items.projects.label">
</button>
<button *ngIf="appStateService.activeProject"
[routerLink]="'/ui/projects/'+appStateService.activeProjectId"
mat-menu-item>{{appStateService.activeProject.project.projectName}}</button>
<button *ngIf="appStateService.activeFile"
[routerLink]="'/ui/projects/'+appStateService.activeProjectId+'/file/'+appStateService.activeFile.fileId"
mat-menu-item>{{appStateService.activeFile.filename}}</button>
</mat-menu>
</div>
<div class="menu left visible-lg">
<a class="breadcrumb" routerLink="/ui/projects"
translate="top-bar.navigation-items.projects.label"></a>
<div *ngIf="appStateService.activeProject" class="breadcrumb">
<mat-icon svgIcon="red:double-chevron-right"></mat-icon>
</div>
<a *ngIf="appStateService.activeProject" class="breadcrumb"
[routerLink]="'/ui/projects/'+appStateService.activeProjectId">
{{appStateService.activeProject.project.projectName}}
</a>
<div *ngIf="appStateService.activeFile" class="breadcrumb">
<mat-icon svgIcon="red:double-chevron-right"></mat-icon>
</div>
<a *ngIf="appStateService.activeFile" class="breadcrumb"
[routerLink]="'/ui/projects/'+appStateService.activeProjectId+'/file/'+appStateService.activeFile.fileId">
{{appStateService.activeFile.filename}}
</a>
</div>
<div class="center">
<redaction-logo></redaction-logo>
<div class="app-name" translate="app-name.label"></div>
</div>
<div class="menu right">
<button [matMenuTriggerFor]="menu" mat-button>
<redaction-initials-avatar color="red-white" size="small" [username]="user?.name" [withName]="true"></redaction-initials-avatar>
<mat-icon>arrow_drop_down</mat-icon>
</button>
<mat-menu #menu="matMenu">
<button [matMenuTriggerFor]="language" mat-menu-item
translate="top-bar.navigation-items.my-account.children.language.label"></button>
<mat-menu #language="matMenu">
<button (click)="changeLanguage('en')" mat-menu-item
translate="top-bar.navigation-items.my-account.children.language.english.label"></button>
<button (click)="changeLanguage('de')" mat-menu-item
translate="top-bar.navigation-items.my-account.children.language.german.label"></button>
</mat-menu>
<button (click)="logout()" mat-menu-item>
<mat-icon svgIcon="red:logout">
</mat-icon>
<span translate="top-bar.navigation-items.my-account.children.logout.label">
</span>
</button>
</mat-menu>
</div>
</div>
<div class="divider"></div>
</div>
<div class="red-content">
<router-outlet></router-outlet>
</div>