mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-04-18 06:15:12 +00:00
2f4ce6221e
+ added boxed layout option + added a close overlay to theme options + moved the buy button to the footer + added fade-in-out animation + File Manager app min row height
94 lines
3.4 KiB
HTML
94 lines
3.4 KiB
HTML
<md-toolbar class="p-0 mat-elevation-z1">
|
|
|
|
<div fxFlex fxFill fxLayout="row" fxLayoutAlign="start center">
|
|
|
|
<div fxFlex="1 0 auto" fxLayout="row" fxLayoutAlign="start center">
|
|
|
|
<button md-button class="toggle-button-navbar mat-icon-button"
|
|
fuseNavbarVertical="openBar" fxHide.gt-md>
|
|
<md-icon>menu</md-icon>
|
|
</button>
|
|
|
|
<div class="toolbar-separator" fxHide.gt-md></div>
|
|
|
|
<div fxLayout="row" fxLayoutAlign="start center" *ngIf="horizontalNav">
|
|
<div class="logo ml-16">
|
|
<span class="logo-icon">F</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="px-8 px-md-16">
|
|
<fuse-shortcuts></fuse-shortcuts>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="" fxFlex="0 1 auto" fxLayout="row" fxLayoutAlign="start center">
|
|
|
|
<md-spinner *ngIf="showSpinner" class="loading-spinner mx-8"></md-spinner>
|
|
|
|
<button md-button [mdMenuTriggerFor]="userMenu"
|
|
class="user-button">
|
|
<div fxLayout="row" fxLayoutAlign="center center">
|
|
<img class="avatar" src="assets/images/avatars/profile.jpg">
|
|
<span class="username mr-12" fxHide fxShow.gt-sm>John Doe</span>
|
|
<md-icon class="s-16" fxHide.xs>keyboard_arrow_down</md-icon>
|
|
</div>
|
|
</button>
|
|
|
|
<md-menu #userMenu="mdMenu">
|
|
|
|
<button md-menu-item>
|
|
<md-icon>account_circle</md-icon>
|
|
<span>My Profile</span>
|
|
</button>
|
|
|
|
<button md-menu-item class="">
|
|
<md-icon>mail</md-icon>
|
|
<span>Inbox</span>
|
|
</button>
|
|
|
|
<button md-menu-item class="">
|
|
<md-icon>exit_to_app</md-icon>
|
|
<span>Logout</span>
|
|
</button>
|
|
|
|
</md-menu>
|
|
|
|
<div class="toolbar-separator"></div>
|
|
|
|
<fuse-search-bar (onInput)="search($event)"></fuse-search-bar>
|
|
|
|
<div class="toolbar-separator"></div>
|
|
|
|
<button md-button fxHide fxShow.gt-xs
|
|
class="language-button"
|
|
[mdMenuTriggerFor]="languageMenu">
|
|
<div fxLayout="row" fxLayoutAlign="center center">
|
|
<img class="flag mr-8" [src]="'assets/images/flags/'+selectedLanguage.flag+'.png'">
|
|
<span class="iso text-uppercase">{{selectedLanguage.id}}</span>
|
|
</div>
|
|
</button>
|
|
|
|
<md-menu #languageMenu="mdMenu">
|
|
<button md-menu-item *ngFor="let lang of languages" (click)="selectedLanguage = lang">
|
|
<div fxLayout="row" fxLayoutAlign="start center">
|
|
<img class="flag mr-16" [src]="'assets/images/flags/'+lang.flag+'.png'">
|
|
<span class="iso">{{lang.title}}</span>
|
|
</div>
|
|
</button>
|
|
</md-menu>
|
|
|
|
<div class="toolbar-separator"></div>
|
|
|
|
<button md-icon-button
|
|
class="mat-icon-button quick-panel-toggle-button"
|
|
fuseMdSidenavToggler="quick-panel"
|
|
aria-label="Toggle quick panel">
|
|
<md-icon class="icon">format_list_bulleted</md-icon>
|
|
</button>
|
|
|
|
</div>
|
|
</div>
|
|
</md-toolbar>
|