Andreas/ngx-admin
1
0
Fork 0
mirror of https://github.com/akveo/ngx-admin.git synced 2025-12-16 23:40:14 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor(app): replace custom actions with built-in component

Browse source
This commit is contained in:
Dmitry Nehaychik 2017-04-29 18:41:44 +03:00
parent 0fc2b32085
commit 916289eb94
4 changed files with 23 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/app/@theme/components/header/_header.component.theme.scss
View file

@ -1,5 +1,5 @@
@mixin base-header-theme($theme-name) { @mixin base-header-theme($theme-name) {
/deep/ base-header { /deep/ header {
.logo > a { .logo > a {
color: $nga-color-secondary !important; color: $nga-color-secondary !important;
@ -7,10 +7,5 @@
color: $nga-color-inverse !important; color: $nga-color-inverse !important;
} }
} }
.left > *,
.right > * {
border-color: rgba($nga-color-inverse, 0.2);
}
} }
} }

26
src/app/@theme/components/header/header.component.scss
View file

@ -3,16 +3,6 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
i.control-icon {
&::before {
font-size: 2.3rem;
}
&:hover {
cursor: pointer;
}
}
div { div {
display: flex; display: flex;
align-items: center; align-items: center;
@ -55,21 +45,5 @@
} }
} }
} }
.right {
> * {
padding: 0 1.25rem;
border-left-width: 1px;
border-left-style: solid;
&:first-child {
border: none;
}
&:last-child {
padding-right: 0;
}
}
}
} }

27
src/app/@theme/components/header/header.component.ts
View file

@ -12,16 +12,29 @@ import { NgaThemeService } from '@nga/theme/services/theme.service';
<span class="logo" (click)="goToHome()">NgX&nbsp;<a>Admin</a></span> <span class="logo" (click)="goToHome()">NgX&nbsp;<a>Admin</a></span>
<button (click)="switchTheme()">Switch Theme!</button> <button (click)="switchTheme()">Switch Theme!</button>
</div> </div>
<div class="right">
<search-input></search-input> <nga-actions size="medium" inverse class="right">
<i class="control-icon ion ion-ios-email-outline"></i> <nga-action><search-input></search-input></nga-action>
<i class="control-icon ion ion-ios-bell-outline"></i> <nga-action icon="ion-ios-email-outline"></nga-action>
<nga-user></nga-user> <nga-action disabled icon="ion-ios-bell-outline"></nga-action>
<i class="control-icon ion ion-ios-gear-outline"></i> <nga-action>
</div> <nga-user [menu]="userMenu" name="Han Solo"></nga-user>
</nga-action>
<nga-action icon="ion-ios-gear-outline"></nga-action>
</nga-actions>
`, `,
}) })
export class HeaderComponent { export class HeaderComponent {
userMenu = [
{
title: 'Profile',
},
{
title: 'Log out',
},
];
constructor(private sidebarService: NgaSidebarService, constructor(private sidebarService: NgaSidebarService,
private menuService: NgaMenuService, private menuService: NgaMenuService,
private themeService: NgaThemeService) { private themeService: NgaThemeService) {

2
src/app/@theme/theme.module.ts
View file

@ -10,6 +10,7 @@ import {
NgaSidebarModule, NgaSidebarModule,
NgaMenuModule, NgaMenuModule,
NgaUserModule, NgaUserModule,
NgaActionsModule,
} from '@nga/theme'; } from '@nga/theme';
import { SearchInputComponent, HeaderComponent, FooterComponent } from './components'; import { SearchInputComponent, HeaderComponent, FooterComponent } from './components';
@ -28,6 +29,7 @@ const NGA_MODULES = [
NgaRouteTabsetModule, NgaRouteTabsetModule,
NgaMenuModule, NgaMenuModule,
NgaUserModule, NgaUserModule,
NgaActionsModule,
]; ];
const COMPONENTS = [ const COMPONENTS = [