feat(header): add right controls

This commit is contained in:
tibing 2017-04-18 15:45:49 +03:00
parent 58c9114ff9
commit e0f79206bb
2 changed files with 20 additions and 12 deletions

View file

@ -4,6 +4,15 @@
nga-layout-header > nav {
justify-content: space-between;
i.control-icon {
font-size: 2.3rem;
&:hover {
cursor: pointer;
color: $nga-color-secondary;
}
}
div {
display: flex;
align-items: center;
@ -23,13 +32,8 @@
}
}
i.menu-collapse {
.control-icon.ion-navicon {
font-size: 2.8rem;
&:hover {
cursor: pointer;
color: $nga-color-secondary;
}
}
.logo {
@ -50,14 +54,14 @@
.right {
> * {
padding: 0 1.25rem;
border-left: 1px solid rgba($nga-color-primary, 0.2);
border-left: 1px solid rgba($nga-color-default, 0.2);
&:first-child {
border: none;
}
&:last-child {
padding-left: 0;
padding-right: 0;
}
}
}

View file

@ -18,11 +18,15 @@ import { NgaSidebarService } from '@nga/theme/components/sidebar/sidebar.service
<nga-layout>
<nga-layout-header fixed>
<div class="left">
<i class="menu-collapse ion ion-navicon" (click)="toggleSidebar()"></i>
<i class="control-icon ion ion-navicon" (click)="toggleSidebar()"></i>
<a href="/#/pages/dashboard" class="logo">NgX <span>Admin</span></a>
</div>
<div class="right">
<i class="control-icon ion ion-ios-search"></i>
<i class="control-icon ion ion-ios-email-outline"></i>
<i class="control-icon ion ion-ios-bell-outline"></i>
<nga-user></nga-user>
<i class="control-icon ion ion-ios-gear-outline"></i>
</div>
</nga-layout-header>
@ -31,11 +35,11 @@ import { NgaSidebarService } from '@nga/theme/components/sidebar/sidebar.service
<ng-content select="nga-menu"></ng-content>
</nga-sidebar-content>
</nga-sidebar>
<nga-layout-column>
<ng-content select="router-outlet"></ng-content>
</nga-layout-column>
<nga-layout-footer fixed>
</nga-layout-footer>
</nga-layout>