mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-01-10 04:25:08 +00:00
Responsive refinement on some doc pages,
Navigation scrool fix on collapse toggled.
This commit is contained in:
parent
5e4940fed9
commit
9400c3d748
|
@ -5,6 +5,7 @@ import { BehaviorSubject } from 'rxjs/BehaviorSubject';
|
|||
@Injectable()
|
||||
export class FuseNavigationService
|
||||
{
|
||||
onNavCollapseToggle = new EventEmitter<any>();
|
||||
onNavCollapseToggled = new EventEmitter<any>();
|
||||
onNavigationModelChange: BehaviorSubject<any> = new BehaviorSubject({});
|
||||
navigationModel: NavigationModel;
|
||||
|
|
|
@ -43,7 +43,7 @@ export class FuseNavVerticalCollapseComponent implements OnInit
|
|||
this.navigationService.onNavCollapseToggled
|
||||
.subscribe(
|
||||
(clickedItem) => {
|
||||
if ( clickedItem.children )
|
||||
if ( clickedItem && clickedItem.children )
|
||||
{
|
||||
// Check if the clicked item is one
|
||||
// of the children of this item
|
||||
|
@ -82,6 +82,7 @@ export class FuseNavVerticalCollapseComponent implements OnInit
|
|||
|
||||
// Navigation collapse toggled...
|
||||
this.navigationService.onNavCollapseToggled.emit(this.item);
|
||||
this.navigationService.onNavCollapseToggle.emit();
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -95,6 +96,7 @@ export class FuseNavVerticalCollapseComponent implements OnInit
|
|||
}
|
||||
|
||||
this.isOpen = true;
|
||||
this.navigationService.onNavCollapseToggle.emit();
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -107,6 +109,7 @@ export class FuseNavVerticalCollapseComponent implements OnInit
|
|||
return;
|
||||
}
|
||||
this.isOpen = false;
|
||||
this.navigationService.onNavCollapseToggle.emit();
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<div id="ngx-datatable" class="page-layout simple fullwidth" fusePerfectScrollbar>
|
||||
|
||||
<!-- HEADER -->
|
||||
<div class="header md-accent-bg p-24 h-160" fxLayout="row" fxLayoutAlign="space-between">
|
||||
<div fxLayout="column" fxLayoutAlign="center start">
|
||||
<div class="header md-accent-bg p-24 h-160" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="space-between center">
|
||||
<div fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="column" fxLayoutAlign.gt-xs="center start">
|
||||
<div class="black-fg" fxLayout="row" fxLayoutAlign="start center">
|
||||
<md-icon class="secondary-text s-16">home</md-icon>
|
||||
<md-icon class="secondary-text s-16">chevron_right</md-icon>
|
||||
|
@ -11,15 +11,13 @@
|
|||
<div class="h2 mt-16">ngx-datatable</div>
|
||||
</div>
|
||||
|
||||
<div fxLayout="row" fxLayoutAlign="start center">
|
||||
<a md-raised-button class="md-white-bg"
|
||||
<a md-raised-button class="reference-button md-white-bg mt-16 mt-sm-0"
|
||||
href="https://github.com/swimlane/ngx-datatable"
|
||||
target="_blank">
|
||||
<md-icon>link</md-icon>
|
||||
<span>Reference</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- / HEADER -->
|
||||
|
||||
<!-- CONTENT -->
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
<div class="page-layout simple fullwidth angular-material-element" fusePerfectScrollbar>
|
||||
|
||||
<!-- HEADER -->
|
||||
<div class="header md-accent-bg p-24 h-160" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div class="header md-accent-bg p-24 h-160" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="space-between center">
|
||||
|
||||
<div fxLayout="column" fxLayoutAlign="center start">
|
||||
<div fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="column" fxLayoutAlign.gt-xs="center start">
|
||||
<div class="black-fg" fxLayout="row" fxLayoutAlign="start center">
|
||||
<md-icon class="secondary-text s-16">home</md-icon>
|
||||
<md-icon class="secondary-text s-16">chevron_right</md-icon>
|
||||
|
@ -14,7 +14,7 @@
|
|||
<div class="h2 mt-16">{{title}}</div>
|
||||
</div>
|
||||
|
||||
<a md-raised-button class="reference-button md-white-bg" href="https://material.io/icons/" target="_blank">
|
||||
<a md-raised-button class="reference-button md-white-bg mt-16 mt-sm-0" href="https://material.io/icons/" target="_blank">
|
||||
<md-icon>link</md-icon>
|
||||
<span>Reference</span>
|
||||
</a>
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
<div id="material-colors" class="page-layout simple tabbed" fxLayout="column" fusePerfectScrollbar>
|
||||
|
||||
<!-- HEADER -->
|
||||
<div class="header md-accent-bg p-24 h-160" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div class="header md-accent-bg p-24 h-160" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="space-between center">
|
||||
|
||||
<div fxLayout="column" fxLayoutAlign="center start">
|
||||
<div fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="column" fxLayoutAlign.gt-xs="center start">
|
||||
<div class="black-fg" fxLayout="row" fxLayoutAlign="start center">
|
||||
<md-icon class="secondary-text s-16">home</md-icon>
|
||||
<md-icon class="secondary-text s-16">chevron_right</md-icon>
|
||||
|
@ -12,7 +12,7 @@
|
|||
<div class="h1 mt-16">Colors</div>
|
||||
</div>
|
||||
|
||||
<a md-raised-button class="reference-button md-white-bg"
|
||||
<a md-raised-button class="reference-button md-white-bg mt-16 mt-sm-0"
|
||||
href="https://www.google.com/design/spec/style/color.html#color-color-palette"
|
||||
target="_blank">
|
||||
<md-icon>link</md-icon>
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
<div id="helper-classes" class="page-layout simple tabbed" fxLayout="column" fusePerfectScrollbar>
|
||||
|
||||
<!-- HEADER -->
|
||||
<div class="header md-accent-bg p-24 h-160" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div class="header md-accent-bg p-24 h-160" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="space-between center">
|
||||
|
||||
<div fxLayout="column" fxLayoutAlign="center start">
|
||||
<div fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="column" fxLayoutAlign.gt-xs="center start">
|
||||
<div class="black-fg" fxLayout="row" fxLayoutAlign="start center">
|
||||
<md-icon class="secondary-text s-16">home</md-icon>
|
||||
<md-icon class="secondary-text s-16">chevron_right</md-icon>
|
||||
|
@ -12,7 +12,7 @@
|
|||
<div class="h1 mt-16">Icons</div>
|
||||
</div>
|
||||
|
||||
<a md-raised-button class="reference-button md-white-bg" href="https://material.angular.io" target="_blank">
|
||||
<a md-raised-button class="reference-button md-white-bg mt-16 mt-sm-0" href="https://material.angular.io" target="_blank">
|
||||
<md-icon>link</md-icon>
|
||||
<span>Reference</span>
|
||||
</a>
|
||||
|
|
|
@ -43,8 +43,7 @@ export class FuseNavbarVerticalComponent implements OnInit, OnDestroy
|
|||
{
|
||||
navBarService.setNavBar(this);
|
||||
|
||||
this.fuseNavigationService.onNavCollapseToggled.subscribe(() => {
|
||||
|
||||
this.fuseNavigationService.onNavCollapseToggle.subscribe(() => {
|
||||
setTimeout(() => {
|
||||
this.fusePerfectScrollbarDirective.update();
|
||||
}, 310);
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<input mdInput placeholder="State" aria-label="State" [mdAutocomplete]="auto" [formControl]="stateCtrl">
|
||||
<md-autocomplete #auto="mdAutocomplete">
|
||||
<md-option *ngFor="let state of filteredStates | async" [value]="state.name">
|
||||
<img style="vertical-align:middle;" aria-hidden src="{{state.flag}}" height="25" />
|
||||
<img style="vertical-align:middle;" aria-hidden src="{{state.flag}}" width="25" />
|
||||
<span>{{ state.name }}</span> |
|
||||
<small>Population: {{state.population}}</small>
|
||||
</md-option>
|
||||
|
|
Loading…
Reference in New Issue
Block a user