Increased version number

Fixed: Sidenav helper causes issues on mobile media steps
2025-01-09 20:15:07 +00:00 · 2017-11-27 17:20:34 +03:00 · 2017-11-27 17:20:34 +03:00 · 19fdbbdbcb
commit 19fdbbdbcb
parent 8bbabd7437
24 changed files with 38 additions and 89 deletions
--- 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"
      }
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "fuse2",
-  "version": "1.2.2",
+  "version": "1.2.3",
  "license": "",
  "scripts": {
    "ng": "ng",
--- 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()
--- 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;
--- a/src/app/main/content/apps/chat/chat.component.html
+++ b/src/app/main/content/apps/chat/chat.component.html
@ -13,7 +13,7 @@
            <mat-sidenav-container>

                <!-- LEFT SIDENAV -->
-                <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+                <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                             fuseMatSidenavHelper="chat-left-sidenav" mat-is-locked-open="gt-md">
                    <fuse-chat-left-sidenav></fuse-chat-left-sidenav>
                </mat-sidenav>
@ -26,7 +26,7 @@
                <!-- / CONTENT -->

                <!-- RIGHT SIDENAV -->
-                <mat-sidenav class="sidenav mat-sidenav-opened" align="end" opened="false" mode="over"
+                <mat-sidenav class="sidenav" align="end" opened="false" mode="over"
                             fuseMatSidenavHelper="chat-right-sidenav">
                    <fuse-chat-right-sidenav></fuse-chat-right-sidenav>
                </mat-sidenav>
--- a/src/app/main/content/apps/contacts/contacts.component.html
+++ b/src/app/main/content/apps/contacts/contacts.component.html
@ -42,7 +42,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="contacts-main-sidenav" mat-is-locked-open="gt-sm">

            <fuse-contacts-main-sidenav *fuseIfOnDom [@animate]="{value:'*'}"></fuse-contacts-main-sidenav>
--- a/src/app/main/content/apps/dashboards/project/project.component.html
+++ b/src/app/main/content/apps/dashboards/project/project.component.html
@ -688,7 +688,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="end" mode="side" opened="true" fuseMatSidenavHelper="dashboards-right-sidenav" mat-is-locked-open="gt-md">
+        <mat-sidenav class="sidenav" align="end" mode="side" opened="true" fuseMatSidenavHelper="dashboards-right-sidenav" mat-is-locked-open="gt-md">

            <div class="sidenav-content" fusePerfectScrollbar>

--- a/src/app/main/content/apps/file-manager/file-manager.component.html
+++ b/src/app/main/content/apps/file-manager/file-manager.component.html
@ -69,7 +69,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav right-sidenav mat-sidenav-opened" align="end" opened="true" mode="side"
+        <mat-sidenav class="sidenav right-sidenav " align="end" opened="true" mode="side"
                     fuseMatSidenavHelper="file-manager-right-sidenav" mat-is-locked-open="gt-md">
            <fuse-file-manager-details-sidenav></fuse-file-manager-details-sidenav>
        </mat-sidenav>
--- a/src/app/main/content/apps/mail/mail.component.html
+++ b/src/app/main/content/apps/mail/mail.component.html
@ -7,7 +7,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" mode="side" opened="true"
+        <mat-sidenav class="sidenav" align="start" mode="side" opened="true"
                     fuseMatSidenavHelper="carded-left-sidenav" mat-is-locked-open="gt-md">
            <fuse-mail-main-sidenav></fuse-mail-main-sidenav>
        </mat-sidenav>
--- a/src/app/main/content/apps/todo/todo.component.html
+++ b/src/app/main/content/apps/todo/todo.component.html
@ -7,7 +7,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-left-sidenav" mat-is-locked-open="gt-md">
            <fuse-todo-main-sidenav></fuse-todo-main-sidenav>
        </mat-sidenav>
--- a/src/app/main/content/ui/page-layouts/carded/left-sidenav-2-tabbed/left-sidenav-2-tabbed.component.html
+++ b/src/app/main/content/ui/page-layouts/carded/left-sidenav-2-tabbed/left-sidenav-2-tabbed.component.html
@ -7,7 +7,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-left-sidenav" mat-is-locked-open="gt-md">

            <!-- SIDENAV HEADER -->
--- a/src/app/main/content/ui/page-layouts/carded/left-sidenav-2/left-sidenav-2.component.html
+++ b/src/app/main/content/ui/page-layouts/carded/left-sidenav-2/left-sidenav-2.component.html
@ -7,7 +7,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-left-sidenav" mat-is-locked-open="gt-md">

            <!-- SIDENAV HEADER -->
--- a/src/app/main/content/ui/page-layouts/carded/left-sidenav-tabbed/left-sidenav-tabbed.component.html
+++ b/src/app/main/content/ui/page-layouts/carded/left-sidenav-tabbed/left-sidenav-tabbed.component.html
@ -7,7 +7,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-left-sidenav" mat-is-locked-open="gt-md">

            <!-- SIDENAV HEADER -->
--- a/src/app/main/content/ui/page-layouts/carded/left-sidenav/left-sidenav.component.html
+++ b/src/app/main/content/ui/page-layouts/carded/left-sidenav/left-sidenav.component.html
@ -7,7 +7,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-left-sidenav" mat-is-locked-open="gt-md">

            <!-- SIDENAV HEADER -->
--- a/src/app/main/content/ui/page-layouts/carded/right-sidenav-2-tabbed/right-sidenav-2-tabbed.component.html
+++ b/src/app/main/content/ui/page-layouts/carded/right-sidenav-2-tabbed/right-sidenav-2-tabbed.component.html
@ -126,7 +126,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="end" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="end" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-left-sidenav" mat-is-locked-open="gt-md">

            <!-- SIDENAV HEADER -->
--- a/src/app/main/content/ui/page-layouts/carded/right-sidenav-2/right-sidenav-2.component.html
+++ b/src/app/main/content/ui/page-layouts/carded/right-sidenav-2/right-sidenav-2.component.html
@ -45,7 +45,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="end" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="end" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-right-sidenav" mat-is-locked-open="gt-md">

            <!-- SIDENAV HEADER -->
--- a/src/app/main/content/ui/page-layouts/carded/right-sidenav-tabbed/right-sidenav-tabbed.component.html
+++ b/src/app/main/content/ui/page-layouts/carded/right-sidenav-tabbed/right-sidenav-tabbed.component.html
@ -126,7 +126,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="end" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="end" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-left-sidenav" mat-is-locked-open="gt-md">

            <!-- SIDENAV HEADER -->
--- a/src/app/main/content/ui/page-layouts/carded/right-sidenav/right-sidenav.component.html
+++ b/src/app/main/content/ui/page-layouts/carded/right-sidenav/right-sidenav.component.html
@ -45,7 +45,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="end" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="end" opened="true" mode="side"
                     fuseMatSidenavHelper="carded-right-sidenav" mat-is-locked-open="gt-md">

            <!-- SIDENAV HEADER -->
--- a/src/app/main/content/ui/page-layouts/simple/left-sidenav-2/left-sidenav-2.component.html
+++ b/src/app/main/content/ui/page-layouts/simple/left-sidenav-2/left-sidenav-2.component.html
@ -3,7 +3,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened p-24" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav  p-24" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="simple-left-sidenav-2" mat-is-locked-open="gt-md">

            <fuse-demo-sidenav></fuse-demo-sidenav>
--- a/src/app/main/content/ui/page-layouts/simple/left-sidenav-3/left-sidenav-3.component.html
+++ b/src/app/main/content/ui/page-layouts/simple/left-sidenav-3/left-sidenav-3.component.html
@ -19,7 +19,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="simple-left-sidenav-3" mat-is-locked-open="gt-md">

            <div class="sidenav-content" fusePerfectScrollbar>
--- a/src/app/main/content/ui/page-layouts/simple/left-sidenav/left-sidenav.component.html
+++ b/src/app/main/content/ui/page-layouts/simple/left-sidenav/left-sidenav.component.html
@ -3,7 +3,7 @@
    <mat-sidenav-container>

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="start" opened="true" mode="side"
                     fuseMatSidenavHelper="simple-left-sidenav" mat-is-locked-open="gt-md">

            <div class="sidenav-content p-24" fusePerfectScrollbar>
--- a/src/app/main/content/ui/page-layouts/simple/right-sidenav-2/right-sidenav-2.component.html
+++ b/src/app/main/content/ui/page-layouts/simple/right-sidenav-2/right-sidenav-2.component.html
@ -33,7 +33,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened p-24" align="end" opened="true" mode="side"
+        <mat-sidenav class="sidenav  p-24" align="end" opened="true" mode="side"
                     fuseMatSidenavHelper="simple-right-sidenav-2" mat-is-locked-open="gt-md">

            <fuse-demo-sidenav></fuse-demo-sidenav>
--- a/src/app/main/content/ui/page-layouts/simple/right-sidenav-3/right-sidenav-3.component.html
+++ b/src/app/main/content/ui/page-layouts/simple/right-sidenav-3/right-sidenav-3.component.html
@ -33,7 +33,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="end" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="end" opened="true" mode="side"
                     fuseMatSidenavHelper="simple-right-sidenav-3" mat-is-locked-open="gt-md">

            <div class="sidenav-content" fusePerfectScrollbar>
--- a/src/app/main/content/ui/page-layouts/simple/right-sidenav/right-sidenav.component.html
+++ b/src/app/main/content/ui/page-layouts/simple/right-sidenav/right-sidenav.component.html
@ -33,7 +33,7 @@
        <!-- / CENTER -->

        <!-- SIDENAV -->
-        <mat-sidenav class="sidenav mat-sidenav-opened" align="end" opened="true" mode="side"
+        <mat-sidenav class="sidenav" align="end" opened="true" mode="side"
                     fuseMatSidenavHelper="simple-right-sidenav" mat-is-locked-open="gt-md">

            <div class="sidenav-content p-24" fusePerfectScrollbar>