mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-01-10 04:25:08 +00:00
fixed sidenav for fuse https://github.com/angular/material2/issues/7201
This commit is contained in:
parent
126e32d9e7
commit
32960abd7c
3
package-lock.json
generated
3
package-lock.json
generated
|
@ -9178,8 +9178,7 @@
|
|||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
|
||||
"integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
"dev": true
|
||||
},
|
||||
"uglifyjs-webpack-plugin": {
|
||||
"version": "0.4.6",
|
||||
|
|
|
@ -267,7 +267,7 @@ export class Animations
|
|||
|
||||
public static routerTransitionFade = trigger('routerTransitionFade', [
|
||||
|
||||
transition('* => *', [
|
||||
transition('* => *', group([
|
||||
|
||||
query('fuse-content > :enter, fuse-content > :leave ', [
|
||||
style({
|
||||
|
@ -283,28 +283,26 @@ export class Animations
|
|||
opacity: 0
|
||||
})
|
||||
], {optional: true}),
|
||||
// sequence([
|
||||
query('fuse-content > :leave', [
|
||||
style({
|
||||
opacity: 1
|
||||
}),
|
||||
animate('300ms cubic-bezier(0.250, 0.460, 0.450, 0.940)',
|
||||
style({
|
||||
opacity: 0
|
||||
}))
|
||||
], {optional: true}),
|
||||
query('fuse-content > :enter', [
|
||||
query('fuse-content > :leave', [
|
||||
style({
|
||||
opacity: 1
|
||||
}),
|
||||
animate('300ms cubic-bezier(0.250, 0.460, 0.450, 0.940)',
|
||||
style({
|
||||
opacity: 0
|
||||
}),
|
||||
animate('300ms cubic-bezier(0.250, 0.460, 0.450, 0.940)',
|
||||
style({
|
||||
opacity: 1
|
||||
}))
|
||||
], {optional: true}),
|
||||
// ]),
|
||||
}))
|
||||
], {optional: true}),
|
||||
query('fuse-content > :enter', [
|
||||
style({
|
||||
opacity: 0
|
||||
}),
|
||||
animate('300ms cubic-bezier(0.250, 0.460, 0.450, 0.940)',
|
||||
style({
|
||||
opacity: 1
|
||||
}))
|
||||
], {optional: true}),
|
||||
query('fuse-content > :enter', animateChild(), {optional: true}),
|
||||
query('fuse-content > :leave', animateChild(), {optional: true})
|
||||
])
|
||||
]))
|
||||
]);
|
||||
}
|
||||
|
|
|
@ -73,7 +73,7 @@ export class FuseMdSidenavHelperDirective implements OnInit, AfterViewInit, OnDe
|
|||
{
|
||||
setTimeout(() => {
|
||||
this.stopTransition = false;
|
||||
}, 0);
|
||||
}, 300);
|
||||
}
|
||||
|
||||
ngOnDestroy()
|
||||
|
|
|
@ -4,3 +4,50 @@
|
|||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
md-sidenav-container {
|
||||
|
||||
md-sidenav {
|
||||
order: 1;
|
||||
|
||||
&.md-is-locked-open {
|
||||
position: relative !important;
|
||||
}
|
||||
|
||||
&.md-stop-transition {
|
||||
transition: none !important;
|
||||
transform: translate3d(0, 0, 0) !important;
|
||||
|
||||
~ .mat-sidenav-content,
|
||||
~ .mat-drawer-content {
|
||||
transition: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.mat-sidenav-opened {
|
||||
|
||||
&.mat-drawer-side {
|
||||
|
||||
&.md-is-locked-open {
|
||||
position: relative !important;
|
||||
}
|
||||
|
||||
~ .mat-sidenav-content,
|
||||
~ .mat-drawer-content {
|
||||
transition: none !important;
|
||||
margin-left: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
transform: translate3d(0, 0, 0) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.mat-drawer-end {
|
||||
order: 3;
|
||||
}
|
||||
}
|
||||
|
||||
.mat-drawer-content {
|
||||
order: 2;
|
||||
}
|
||||
}
|
|
@ -137,19 +137,10 @@ $top-bg-image: url('assets/images/backgrounds/header-bg.png');
|
|||
@include mat-elevation(7);
|
||||
|
||||
&.md-is-locked-open {
|
||||
position: relative;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&.md-stop-transition {
|
||||
|
||||
~ .mat-sidenav-content,
|
||||
~ .mat-drawer-content {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
height: $carded-header-height;
|
||||
min-height: $carded-header-height;
|
||||
|
@ -233,7 +224,6 @@ $top-bg-image: url('assets/images/backgrounds/header-bg.png');
|
|||
|
||||
~ .mat-sidenav-content,
|
||||
~ .mat-drawer-content {
|
||||
margin-left: 0 !important;
|
||||
|
||||
.center {
|
||||
margin-left: 0;
|
||||
|
@ -257,7 +247,6 @@ $top-bg-image: url('assets/images/backgrounds/header-bg.png');
|
|||
|
||||
~ .mat-sidenav-content,
|
||||
~ .mat-drawer-content {
|
||||
margin-right: 0 !important;
|
||||
|
||||
.center {
|
||||
margin-right: 0;
|
||||
|
@ -347,7 +336,8 @@ $top-bg-image: url('assets/images/backgrounds/header-bg.png');
|
|||
|
||||
> md-sidenav-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// flex-direction: column;
|
||||
flex-direction: row;
|
||||
flex: 1;
|
||||
background: none;
|
||||
z-index: 2;
|
||||
|
@ -368,14 +358,6 @@ $top-bg-image: url('assets/images/backgrounds/header-bg.png');
|
|||
background: transparent;
|
||||
}
|
||||
|
||||
&.md-stop-transition {
|
||||
|
||||
~ .mat-sidenav-content,
|
||||
~ .mat-drawer-content {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
.sidenav-content {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
|
@ -687,7 +687,8 @@
|
|||
<!-- / CENTER -->
|
||||
|
||||
<!-- SIDENAV -->
|
||||
<md-sidenav class="sidenav mat-sidenav-opened" align="end" mode="side" fuseMdSidenavHelper="dashboards-right-sidenav" md-is-locked-open="gt-md">
|
||||
<md-sidenav class="sidenav mat-sidenav-opened" align="end" mode="side"
|
||||
fuseMdSidenavHelper="dashboards-right-sidenav" md-is-locked-open="gt-md">
|
||||
|
||||
<div class="sidenav-content" fusePerfectScrollbar>
|
||||
<!-- WIDGET GROUP -->
|
||||
|
|
Loading…
Reference in New Issue
Block a user