diff --git a/package-lock.json b/package-lock.json index e0420e6e..56b7fe25 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "fuse2", - "version": "1.2.2", + "version": "1.2.3", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -161,9 +161,9 @@ } }, "@angular/flex-layout": { - "version": "2.0.0-beta.10-4905443", - "resolved": "https://registry.npmjs.org/@angular/flex-layout/-/flex-layout-2.0.0-beta.10-4905443.tgz", - "integrity": "sha512-jjr6mQ3X2vdEQbsyHD/mz1hfTBUUEOZVLFWEz/sbNoeU7uiA4lvqdp/ASrkZydGJHmTDUYrbBE/9kx0lherZ8Q==", + "version": "2.0.0-beta.10", + "resolved": "https://registry.npmjs.org/@angular/flex-layout/-/flex-layout-2.0.0-beta.10.tgz", + "integrity": "sha512-Y4f+Gw8pjDBwb9IykSTGiYRfVyzLfzTxFvRzKuDYEGUFi2UG3zOmAr2OzkpA/+K4mE5zQ+hYkBJaJD+DXAd/6w==", "requires": { "tslib": "1.8.0" } diff --git a/package.json b/package.json index cd3a9867..06192c7c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "fuse2", - "version": "1.2.2", + "version": "1.2.3", "license": "", "scripts": { "ng": "ng", diff --git a/src/app/core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.directive.ts b/src/app/core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.directive.ts index 334d66bc..4388c7bc 100644 --- a/src/app/core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.directive.ts +++ b/src/app/core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.directive.ts @@ -13,7 +13,6 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy matchMediaSubscription: Subscription; @HostBinding('class.mat-is-locked-open') isLockedOpen = true; - @HostBinding('class.mat-stop-transition') stopTransition = true; @Input('fuseMatSidenavHelper') id: string; @Input('mat-is-locked-open') matIsLockedOpenBreakpoint: string; @@ -33,45 +32,31 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy if ( this.observableMedia.isActive(this.matIsLockedOpenBreakpoint) ) { - setTimeout(() => { - this.isLockedOpen = true; - this.matSidenav.mode = 'side'; - this.matSidenav.open(); - }); - this.stopTransition = false; + this.isLockedOpen = true; + this.matSidenav.mode = 'side'; + this.matSidenav.toggle(true); } else { - setTimeout(() => { - this.isLockedOpen = false; - this.matSidenav.mode = 'over'; - this.matSidenav.close(); - }); - - setTimeout(() => { - this.stopTransition = false; - }, 3000); + this.isLockedOpen = false; + this.matSidenav.mode = 'over'; + this.matSidenav.toggle(false); } this.matchMediaSubscription = this.fuseMatchMedia.onMediaChange.subscribe(() => { if ( this.observableMedia.isActive(this.matIsLockedOpenBreakpoint) ) { - setTimeout(() => { - this.isLockedOpen = true; - this.matSidenav.mode = 'side'; - this.matSidenav.open(); - }); + this.isLockedOpen = true; + this.matSidenav.mode = 'side'; + this.matSidenav.toggle(true); } else { - setTimeout(() => { - this.isLockedOpen = false; - this.matSidenav.mode = 'over'; - this.matSidenav.close(); - }); + this.isLockedOpen = false; + this.matSidenav.mode = 'over'; + this.matSidenav.toggle(false); } }); - } ngOnDestroy() diff --git a/src/app/core/scss/partials/_angular-material-fix.scss b/src/app/core/scss/partials/_angular-material-fix.scss index b2905936..55d10a59 100644 --- a/src/app/core/scss/partials/_angular-material-fix.scss +++ b/src/app/core/scss/partials/_angular-material-fix.scss @@ -6,42 +6,6 @@ } } -// Fix: "Sidenav opening with animations for the first time" -mat-sidenav-container { - - mat-sidenav { - - &[mat-is-locked-open].mat-stop-transition { - transition: none !important; - transform: translate3d(0, 0, 0) !important; - opacity: 0; - - ~ .mat-sidenav-content, - ~ .mat-drawer-content { - transition: none !important; - } - } - - &.mat-sidenav-opened { - - &.mat-drawer-side { - - ~ .mat-sidenav-content, - ~ .mat-drawer-content { - transition: none !important; - transform: translate3d(0, 0, 0) !important; - } - } - } - - &.mat-drawer-end { - } - } - - .mat-drawer-content { - } -} - // Fix: "Inconsistent font sizes across elements" .mat-input-wrapper { font-size: 16px;