ngx-admin/src/app/@theme/components/header/header.component.html
Sergey Andrievskiy 576e369c92 feat: add material
2020-03-30 16:23:05 +03:00

65 lines
2.5 KiB
HTML

<div class="header-container">
<div class="logo-container">
<a href="#"
class="sidebar-toggle"
matRipple
[matRippleUnbounded]="true"
[matRippleCentered]="true"
(click)="toggleSidebar()">
<nb-icon [icon]="(materialTheme$ | async) ? 'menu-outline' : 'menu-2-outline'"></nb-icon>
</a>
<a class="logo" href="#" (click)="navigateHome()">ngx-<span>admin</span></a>
</div>
<nb-select status="primary"
matRipple
[selected]="currentTheme"
(selectedChange)="changeTheme($event)"
class="theme-select">
<nb-option *ngFor="let theme of themes"
[value]="theme.value"
matRipple>
{{ theme.name }}
</nb-option>
</nb-select>
</div>
<div class="header-container">
<nb-actions size="small">
<nb-action class="control-item github-stars">
<span class="subtitle text">Support us: </span>
<iframe src="https://ghbtns.com/github-btn.html?user=akveo&repo=ngx-admin&type=star&count=true"
frameborder="0"
scrolling="0"
width="170px"
height="20px">
</iframe>
</nb-action>
<nb-action class="control-item downloads-count">
<nb-icon icon="download"></nb-icon>
<span class="subtitle number">470.000</span>
</nb-action>
<nb-action class="control-item contact-us" matRipple [matRippleUnbounded]="false" [matRippleCentered]="true">
<a nbButton ghost href="mailto:contact@akveo.com" (click)="trackEmailClick()">
<nb-icon icon="email-outline" pack="eva"></nb-icon>
<span>contact@akveo.com</span>
</a>
</nb-action>
<nb-action class="control-item search">
<nb-search type="rotate-layout"
(click)="startSearch()"
matRipple
[matRippleUnbounded]="true"
[matRippleCentered]="true">
</nb-search>
</nb-action>
<nb-action class="control-item email" icon="email-outline" matRipple [matRippleUnbounded]="true" [matRippleCentered]="true"></nb-action>
<nb-action class="control-item notifications" icon="bell-outline" matRipple [matRippleUnbounded]="true" [matRippleCentered]="true"></nb-action>
<nb-action class="user-action" *nbIsGranted="['view', 'user']" matRipple [matRippleUnbounded]="false" [matRippleCentered]="true">
<nb-user [nbContextMenu]="userMenu"
[onlyPicture]="userPictureOnly"
[name]="user?.name"
[picture]="user?.picture">
</nb-user>
</nb-action>
</nb-actions>
</div>