purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-10 04:25:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added theme options openBar function to the navigation as an example

Browse Source 
+ Removed duplicate Black and White tabs from colors
This commit is contained in:
Sercan Yemen 2017-10-16 10:08:40 +03:00
parent bd8b02c82d
commit ac7e6f75bc
3 changed files with 46 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/app/core/components/theme-options/theme-options.component.ts
View File

@ -3,6 +3,7 @@ import { style, animate, AnimationBuilder, AnimationPlayer } from '@angular/anim
import { Subscription } from 'rxjs/Subscription'; import { Subscription } from 'rxjs/Subscription';
import { FuseConfigService } from '../../services/config.service'; import { FuseConfigService } from '../../services/config.service';
import { fuseAnimations } from '../../animations'; import { fuseAnimations } from '../../animations';
import { FuseNavigationService } from '../navigation/navigation.service';
@Component({ @Component({
selector : 'fuse-theme-options', selector : 'fuse-theme-options',
@ -26,6 +27,7 @@ export class FuseThemeOptionsComponent implements OnInit, OnDestroy
constructor( constructor(
private animationBuilder: AnimationBuilder, private animationBuilder: AnimationBuilder,
private fuseConfig: FuseConfigService, private fuseConfig: FuseConfigService,
private navigationService: FuseNavigationService,
private renderer: Renderer2 private renderer: Renderer2
) )
{ {
@ -38,6 +40,27 @@ export class FuseThemeOptionsComponent implements OnInit, OnDestroy
this.fuseSettings = newSettings; this.fuseSettings = newSettings;
} }
); );
// Get the nav model and add customize nav item
// that opens the bar programmatically
const navModel = this.navigationService.getNavigationModel();
navModel.push({
'id' : 'custom-function',
'title' : 'Custom Function',
'type' : 'group',
'children': [
{
'id' : 'customize',
'title' : 'Customize',
'type' : 'item',
'icon' : 'settings',
'function': () => {
this.openBar();
}
}
]
});
} }
ngOnInit() ngOnInit()

46
src/app/main/content/components/navigation/navigation.component.html
View File

@ -48,15 +48,15 @@
<fuse-hljs lang="json" class="source-code"> <fuse-hljs lang="json" class="source-code">
<textarea #source hidden="hidden"> <textarea #source hidden="hidden">
{ {
'title': 'COMPONENTS', 'title': 'COMPONENTS',
'type' : 'group', 'type' : 'group',
'children': [ 'children': [
{ {
'title': 'ngx-datatable', 'title': 'ngx-datatable',
'type' : 'item', 'type' : 'item',
'url' : '/components/datatables/ngx-datatable' 'url' : '/components/datatables/ngx-datatable'
} }
] ]
}, },
</textarea> </textarea>
</fuse-hljs> </fuse-hljs>
@ -69,16 +69,16 @@
<fuse-hljs lang="json" class="source-code"> <fuse-hljs lang="json" class="source-code">
<textarea #source hidden="hidden"> <textarea #source hidden="hidden">
{ {
'title' : 'Datatables', 'title' : 'Datatables',
'type' : 'collapse', 'type' : 'collapse',
'icon' : 'border_all', 'icon' : 'border_all',
'children': [ 'children': [
{ {
'title': 'ngx-datatable', 'title': 'ngx-datatable',
'type' : 'nav-item', 'type' : 'nav-item',
'url' : '/components/datatables/ngx-datatable' 'url' : '/components/datatables/ngx-datatable'
} }
] ]
}, },
</textarea> </textarea>
</fuse-hljs> </fuse-hljs>
@ -91,10 +91,10 @@
<fuse-hljs lang="json" class="source-code"> <fuse-hljs lang="json" class="source-code">
<textarea #source hidden="hidden"> <textarea #source hidden="hidden">
{ {
'title': 'Countdown', 'title': 'Countdown',
'type' : 'item', 'type' : 'item',
'icon' : 'settings_input_component', 'icon' : 'settings_input_component',
'url' : '/components/countdown' 'url' : '/components/countdown'
}, },
</textarea> </textarea>
</fuse-hljs> </fuse-hljs>

6
src/app/main/content/ui/colors/colors.component.html
View File

@ -39,12 +39,6 @@
</ng-template> </ng-template>
</mat-tab> </mat-tab>
<mat-tab *ngFor="let color of ['white', 'black']" label="{{color}}">
<ng-template mat-tab-label>
<span class="text-capitalize">{{color}}</span>
</ng-template>
</mat-tab>
</mat-tab-group> </mat-tab-group>
<div class="color-tabs-content p-24" fxLayout="column"> <div class="color-tabs-content p-24" fxLayout="column">