(Layout) Apps and pages moved to the new layout system

src/app/main/apps/chat/sidenavs/left/left.component.html

@@ -6,6 +6,7 @@
 
     <chat-user-sidenav class="view"
                        *ngSwitchCase="'user'"
-                       [@slideInLeft]>
+                       [@slideInLeft]
+                       fusePerfectScrollbar>
     </chat-user-sidenav>
 </div>

src/app/main/apps/chat/sidenavs/left/user/user.component.html

@@ -28,7 +28,7 @@
 </div>
 
 <!-- SIDENAV CONTENT -->
-<div class="sidenav-content p-16" fusePerfectScrollbar fxFlex>
+<div class="sidenav-content p-16" fxFlex>
 
     <!-- USER MOOD -->
     <mat-card>

src/app/main/apps/chat/sidenavs/left/user/user.component.scss

@@ -4,6 +4,7 @@
     display: flex;
     flex: 1;
     flex-direction: column;
+    overflow: auto;
 
     mat-toolbar {
 

src/app/main/apps/chat/sidenavs/right/contact/contact.component.html

@@ -18,11 +18,8 @@
 
         <!-- TOOLBAR BOTTOM -->
         <mat-toolbar-row class="toolbar-bottom" fxLayout="column" fxLayoutAlign="center center">
-
             <img [src]="contact.avatar" class="avatar contact-avatar huge" alt="{{contact.name}}"/>
-
             <div class="contact-name my-8">{{contact.name}}</div>
-
         </mat-toolbar-row>
         <!-- / TOOLBAR BOTTOM -->
 
@@ -31,7 +28,7 @@
 </div>
 
 <!-- SIDENAV CONTENT -->
-<div class="sidenav-content p-16" fusePerfectScrollbar fxFlex *ngIf="contact">
+<div class="sidenav-content p-16" fxFlex *ngIf="contact">
 
     <!-- CONTACT MOOD -->
     <mat-card>

src/app/main/apps/chat/sidenavs/right/contact/contact.component.scss

@@ -4,6 +4,7 @@
     display: flex;
     flex: 1;
     flex-direction: column;
+    overflow: auto;
 
     mat-toolbar {
 

src/app/main/apps/chat/sidenavs/right/right.component.html

@@ -2,7 +2,8 @@
 
     <chat-contact-sidenav class="view"
                           *ngSwitchCase="'contact'"
-                          [@slideInRight]>
+                          [@slideInRight]
+                          fusePerfectScrollbar>
     </chat-contact-sidenav>
 
 </div>

src/app/main/apps/file-manager/file-manager.component.scss

@@ -42,6 +42,7 @@
 
         .content {
             flex: 1 1 auto;
+            overflow: auto;
         }
     }
 

src/app/main/pages/authentication/forgot-password-2/forgot-password-2.component.html

@@ -1,23 +1,23 @@
-<div id="forgot-password" fxLayout="row" fxLayoutAlign="start">
+<div id="forgot-password" class="inner-scroll" fxLayout="row" fxLayoutAlign="start">
 
     <div id="forgot-password-intro" fxFlex fxHide fxShow.gt-xs>
 
-        <div class="logo" *fuseIfOnDom [@animate]="{value:'*',params:{scale:'0.2'}}">
+        <div class="logo" [@animate]="{value:'*',params:{scale:'0.2'}}">
             <img src="assets/images/logos/fuse.svg">
         </div>
 
-        <div class="title" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'50ms',y:'25px'}}">
+        <div class="title" [@animate]="{value:'*',params:{delay:'50ms',y:'25px'}}">
             Welcome to the FUSE!
         </div>
 
-        <div class="description" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'100ms',y:'25px'}}">
+        <div class="description" [@animate]="{value:'*',params:{delay:'100ms',y:'25px'}}">
             Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ullamcorper nisl erat,
             vel convallis elit fermentum pellentesque. Sed mollis velit facilisis facilisis viverra.
         </div>
 
     </div>
 
-    <div id="forgot-password-form-wrapper" fusePerfectScrollbar *fuseIfOnDom
+    <div id="forgot-password-form-wrapper" fusePerfectScrollbar
          [@animate]="{value:'*',params:{delay:'300ms',x:'100%'}}">
 
         <div id="forgot-password-form">

src/app/main/pages/authentication/forgot-password-2/forgot-password-2.component.ts

@@ -34,9 +34,15 @@ export class ForgotPassword2Component implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/authentication/forgot-password/forgot-password.component.html

@@ -1,9 +1,8 @@
-<div id="forgot-password" fxLayout="column" fusePerfectScrollbar>
+<div id="forgot-password" fxLayout="column">
 
-    <div id="forgot-password-form-wrapper" fxLayout="column" fxLayoutAlign="center center" *fuseIfOnDom
+    <div id="forgot-password-form-wrapper" fxLayout="column" fxLayoutAlign="center center">
-         [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
-        <div id="forgot-password-form">
+        <div id="forgot-password-form" [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
             <div class="logo">
                 <img src="assets/images/logos/fuse.svg">

src/app/main/pages/authentication/forgot-password/forgot-password.component.scss

@@ -4,7 +4,6 @@
 
     #forgot-password {
         width: 100%;
-        overflow: auto;
         background: url('/assets/images/backgrounds/dark-material-bg.jpg') no-repeat;
         background-size: cover;
 

src/app/main/pages/authentication/forgot-password/forgot-password.component.ts

@@ -34,9 +34,15 @@ export class ForgotPasswordComponent implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/authentication/lock/lock.component.html

@@ -1,8 +1,8 @@
-<div id="lock" fxLayout="column" fusePerfectScrollbar>
+<div id="lock" fxLayout="column">
 
     <div id="lock-form-wrapper" fxLayout="column" fxLayoutAlign="center center">
 
-        <div id="lock-form" *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
+        <div id="lock-form" [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
             <div class="lock-form-header" fxLayout="column" fxLayoutAlign="center center"
                  fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="start center">

src/app/main/pages/authentication/lock/lock.component.scss

@@ -4,7 +4,6 @@
 
     #lock {
         width: 100%;
-        overflow: auto;
         background: url('/assets/images/backgrounds/dark-material-bg.jpg') no-repeat;
         background-size: cover;
 

src/app/main/pages/authentication/lock/lock.component.ts

@@ -34,9 +34,15 @@ export class LockComponent implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/authentication/login-2/login-2.component.html

@@ -1,23 +1,23 @@
-<div id="login" fxLayout="row" fxLayoutAlign="start">
+<div id="login" class="inner-scroll" fxLayout="row" fxLayoutAlign="start">
 
     <div id="login-intro" fxFlex fxHide fxShow.gt-xs>
 
-        <div class="logo" *fuseIfOnDom [@animate]="{value:'*',params:{scale:'0.2'}}">
+        <div class="logo" [@animate]="{value:'*',params:{scale:'0.2'}}">
             <img src="assets/images/logos/fuse.svg">
         </div>
 
-        <div class="title" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'50ms',y:'25px'}}">
+        <div class="title" [@animate]="{value:'*',params:{delay:'50ms',y:'25px'}}">
             Welcome to the FUSE!
         </div>
 
-        <div class="description" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'100ms',y:'25px'}}">
+        <div class="description" [@animate]="{value:'*',params:{delay:'100ms',y:'25px'}}">
             Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ullamcorper nisl erat,
             vel convallis elit fermentum pellentesque. Sed mollis velit facilisis facilisis viverra.
         </div>
 
     </div>
 
-    <div id="login-form-wrapper" fusePerfectScrollbar *fuseIfOnDom
+    <div id="login-form-wrapper" fusePerfectScrollbar
          [@animate]="{value:'*',params:{delay:'300ms',x:'100%'}}">
 
         <div id="login-form">

src/app/main/pages/authentication/login-2/login-2.component.ts

@@ -34,9 +34,15 @@ export class Login2Component implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/authentication/login/login.component.html

@@ -1,8 +1,8 @@
-<div id="login" fxLayout="column" fusePerfectScrollbar>
+<div id="login" fxLayout="column">
 
     <div id="login-form-wrapper" fxLayout="column" fxLayoutAlign="center center">
 
-        <div id="login-form" *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
+        <div id="login-form" [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
             <div class="logo">
                 <img src="assets/images/logos/fuse.svg">

src/app/main/pages/authentication/login/login.component.scss

@@ -4,7 +4,6 @@
 
     #login {
         width: 100%;
-        overflow: auto;
         background: url('/assets/images/backgrounds/dark-material-bg.jpg') no-repeat;
         background-size: cover;
 

src/app/main/pages/authentication/login/login.component.ts

@@ -34,9 +34,15 @@ export class LoginComponent implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/authentication/mail-confirm/mail-confirm.component.html

@@ -1,8 +1,8 @@
-<div id="mail-confirm" fxLayout="column" fusePerfectScrollbar>
+<div id="mail-confirm" fxLayout="column">
 
     <div id="mail-confirm-form-wrapper" fxLayout="column" fxLayoutAlign="center center">
 
-        <div id="mail-confirm-form" *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
+        <div id="mail-confirm-form" [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
             <div class="logo">
                 <mat-icon class="mat-accent s-96">email</mat-icon>

src/app/main/pages/authentication/mail-confirm/mail-confirm.component.scss

@@ -4,7 +4,6 @@
 
     #mail-confirm {
         width: 100%;
-        overflow: auto;
         background: url('/assets/images/backgrounds/dark-material-bg.jpg') no-repeat;
         background-size: cover;
 

src/app/main/pages/authentication/mail-confirm/mail-confirm.component.ts

@@ -23,9 +23,15 @@ export class MailConfirmComponent
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
     }

src/app/main/pages/authentication/register-2/register-2.component.html

@@ -1,23 +1,23 @@
-<div id="register" fxLayout="row" fxLayoutAlign="start">
+<div id="register" class="inner-scroll" fxLayout="row" fxLayoutAlign="start">
 
     <div id="register-intro" fxFlex fxHide fxShow.gt-xs>
 
-        <div class="logo" *fuseIfOnDom [@animate]="{value:'*',params:{scale:'0.2'}}">
+        <div class="logo" [@animate]="{value:'*',params:{scale:'0.2'}}">
             <img src="assets/images/logos/fuse.svg">
         </div>
 
-        <div class="title" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'50ms',y:'25px'}}">
+        <div class="title" [@animate]="{value:'*',params:{delay:'50ms',y:'25px'}}">
             Welcome to the FUSE!
         </div>
 
-        <div class="description" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'100ms',y:'25px'}}">
+        <div class="description" [@animate]="{value:'*',params:{delay:'100ms',y:'25px'}}">
             Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ullamcorper nisl erat,
             vel convallis elit fermentum pellentesque. Sed mollis velit facilisis facilisis viverra.
         </div>
 
     </div>
 
-    <div id="register-form-wrapper" fusePerfectScrollbar *fuseIfOnDom
+    <div id="register-form-wrapper" fusePerfectScrollbar
          [@animate]="{value:'*',params:{delay:'300ms',x:'100%'}}">
 
         <div id="register-form">

src/app/main/pages/authentication/register-2/register-2.component.ts

@@ -34,9 +34,15 @@ export class Register2Component implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/authentication/register/register.component.html

@@ -1,8 +1,8 @@
-<div id="register" fxLayout="column" fusePerfectScrollbar>
+<div id="register" fxLayout="column">
 
     <div id="register-form-wrapper" fxLayout="column" fxLayoutAlign="center center">
 
-        <div id="register-form" *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
+        <div id="register-form" [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
             <div class="logo">
                 <img src="assets/images/logos/fuse.svg">

src/app/main/pages/authentication/register/register.component.scss

@@ -4,7 +4,6 @@
 
     #register {
         width: 100%;
-        overflow: auto;
         background: url('/assets/images/backgrounds/dark-material-bg.jpg') no-repeat;
         background-size: cover;
 

src/app/main/pages/authentication/register/register.component.ts

@@ -28,9 +28,15 @@ export class RegisterComponent implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/authentication/reset-password-2/reset-password-2.component.html

@@ -1,23 +1,23 @@
-<div id="reset-password" fxLayout="row" fxLayoutAlign="start">
+<div id="reset-password" class="inner-scroll" fxLayout="row" fxLayoutAlign="start">
 
     <div id="reset-password-intro" fxFlex fxHide fxShow.gt-xs>
 
-        <div class="logo" *fuseIfOnDom [@animate]="{value:'*',params:{scale:'0.2'}}">
+        <div class="logo" [@animate]="{value:'*',params:{scale:'0.2'}}">
             <img src="assets/images/logos/fuse.svg">
         </div>
 
-        <div class="title" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'50ms',y:'25px'}}">
+        <div class="title" [@animate]="{value:'*',params:{delay:'50ms',y:'25px'}}">
             Welcome to the FUSE!
         </div>
 
-        <div class="description" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'100ms',y:'25px'}}">
+        <div class="description" [@animate]="{value:'*',params:{delay:'100ms',y:'25px'}}">
             Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ullamcorper nisl erat,
             vel convallis elit fermentum pellentesque. Sed mollis velit facilisis facilisis viverra.
         </div>
 
     </div>
 
-    <div id="reset-password-form-wrapper" fusePerfectScrollbar *fuseIfOnDom
+    <div id="reset-password-form-wrapper" fusePerfectScrollbar
          [@animate]="{value:'*',params:{delay:'300ms',x:'100%'}}">
 
         <div id="reset-password-form">

src/app/main/pages/authentication/reset-password-2/reset-password-2.component.ts

@@ -28,9 +28,15 @@ export class ResetPassword2Component implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/authentication/reset-password/reset-password.component.html

@@ -1,9 +1,8 @@
-<div id="reset-password" fxLayout="column" fusePerfectScrollbar>
+<div id="reset-password" fxLayout="column">
 
-    <div id="reset-password-form-wrapper" fxLayout="column" fxLayoutAlign="center center"
+    <div id="reset-password-form-wrapper" fxLayout="column" fxLayoutAlign="center center">
-         *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
-        <div id="reset-password-form">
+        <div id="reset-password-form" [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
             <div class="logo">
                 <img src="assets/images/logos/fuse.svg">

src/app/main/pages/authentication/reset-password/reset-password.component.scss

@@ -4,7 +4,6 @@
 
     #reset-password {
         width: 100%;
-        overflow: auto;
         background: url('/assets/images/backgrounds/dark-material-bg.jpg') no-repeat;
         background-size: cover;
 

src/app/main/pages/authentication/reset-password/reset-password.component.ts

@@ -34,9 +34,15 @@ export class ResetPasswordComponent implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/coming-soon/coming-soon.component.html

@@ -1,8 +1,8 @@
-<div id="coming-soon" fxLayout="column" fusePerfectScrollbar>
+<div id="coming-soon" fxLayout="column">
 
     <div id="coming-soon-form-wrapper" fxLayout="column" fxLayoutAlign="center center">
 
-        <div id="coming-soon-form" *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
+        <div id="coming-soon-form" [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
             <div class="top">
 

src/app/main/pages/coming-soon/coming-soon.component.scss

@@ -4,7 +4,6 @@
 
     #coming-soon {
         width: 100%;
-        overflow: auto;
         background: url('/assets/images/backgrounds/dark-material-bg.jpg') no-repeat;
         background-size: cover;
 

src/app/main/pages/coming-soon/coming-soon.component.ts

@@ -34,9 +34,15 @@ export class ComingSoonComponent implements OnInit, OnDestroy
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
 

src/app/main/pages/errors/404/error-404.component.scss

@@ -4,7 +4,6 @@
 
     #error-404 {
         width: 100%;
-        overflow: auto;
 
         .content {
             width: 90%;

src/app/main/pages/errors/404/error-404.component.ts

@@ -21,9 +21,15 @@ export class Error404Component
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
     }

src/app/main/pages/errors/500/error-500.component.scss

@@ -4,7 +4,6 @@
 
     #error-500 {
         width: 100%;
-        overflow: auto;
 
         .content {
             width: 90%;

src/app/main/pages/errors/500/error-500.component.ts

@@ -9,16 +9,27 @@ import { FuseConfigService } from '@fuse/services/config.service';
 })
 export class Error500Component
 {
+    /**
+     * Constructor
+     *
+     * @param {FuseConfigService} _fuseConfigService
+     */
     constructor(
-        private fuseConfig: FuseConfigService
+        private _fuseConfigService: FuseConfigService
     )
     {
         // Configure the layout
-        this.fuseConfig.config = {
+        this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
     }

src/app/main/pages/faq/faq.component.html

@@ -1,4 +1,4 @@
-<div id="faq" class="page-layout simple" fusePerfectScrollbar>
+<div id="faq" class="page-layout simple full-width">
 
     <!-- HEADER -->
     <div class="header mat-accent-bg p-16 p-sm-24" fxLayout="column" fxLayoutAlign="center center">

src/app/main/pages/invoices/compact/compact.component.html

@@ -1,4 +1,4 @@
-<div id="invoice" class="compact page-layout blank" fxLayout="row" fusePerfectScrollbar>
+<div id="invoice" class="compact page-layout blank" fxLayout="row">
 
     <div class="invoice-container">
 

src/app/main/pages/invoices/compact/compact.component.scss

@@ -6,7 +6,6 @@
 
         &.compact {
             padding: 0;
-            overflow: auto;
 
             .invoice-container {
                 padding: 64px;

src/app/main/pages/invoices/modern/modern.component.html

@@ -1,4 +1,4 @@
-<div id="invoice" class="modern page-layout blank" fxLayout="row" fusePerfectScrollbar>
+<div id="invoice" class="modern page-layout blank" fxLayout="row">
 
     <div class="invoice-container">
 

src/app/main/pages/invoices/modern/modern.component.scss

@@ -6,7 +6,6 @@
 
         &.modern {
             padding: 0;
-            overflow: auto;
 
             .invoice-container {
                 padding: 64px;

src/app/main/pages/knowledge-base/knowledge-base.component.html

@@ -1,4 +1,4 @@
-<div id="knowledgebase" class="page-layout simple" fusePerfectScrollbar>
+<div id="knowledgebase" class="page-layout simple full-width">
 
     <!-- HEADER -->
     <div class="header mat-accent-bg p-16 p-sm-24" fxLayout="column" fxLayoutAlign="center center">

src/app/main/pages/maintenance/maintenance.component.html

@@ -1,8 +1,8 @@
-<div id="maintenance" fxLayout="column" fusePerfectScrollbar>
+<div id="maintenance" fxLayout="column">
 
     <div id="maintenance-form-wrapper" fxLayout="column" fxLayoutAlign="center center">
 
-        <div id="maintenance-form" *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
+        <div id="maintenance-form" [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
 
             <div class="logo">
                 <img src="assets/images/logos/fuse.svg">

src/app/main/pages/maintenance/maintenance.component.scss

@@ -4,7 +4,6 @@
 
     #maintenance {
         width: 100%;
-        overflow: auto;
         background: url('/assets/images/backgrounds/dark-material-bg.jpg') no-repeat;
         background-size: cover;
 

src/app/main/pages/maintenance/maintenance.component.ts

@@ -23,9 +23,15 @@ export class MaintenanceComponent
         // Configure the layout
         this._fuseConfigService.config = {
             layout: {
-                navigation: 'none',
+                navbar : {
-                toolbar   : 'none',
+                    hidden: true
-                footer    : 'none'
+                },
+                toolbar: {
+                    hidden: true
+                },
+                footer : {
+                    hidden: true
+                }
             }
         };
     }

src/app/main/pages/pricing/style-1/style-1.component.html

@@ -1,4 +1,4 @@
-<div id="price-tables" class="page-layout simple fullwidth" fusePerfectScrollbar>
+<div id="price-tables" class="page-layout simple fullwidth">
 
     <!-- HEADER -->
     <div class="header" fxLayout="row" fxLayoutAlign="start start">

src/app/main/pages/pricing/style-2/style-2.component.html

@@ -1,4 +1,4 @@
-<div id="price-tables" class="page-layout simple fullwidth" fusePerfectScrollbar>
+<div id="price-tables" class="page-layout simple fullwidth">
 
     <!-- HEADER -->
     <div class="header" fxLayout="row" fxLayoutAlign="start start">

src/app/main/pages/pricing/style-3/style-3.component.html

@@ -1,4 +1,4 @@
-<div id="price-tables" class="page-layout simple fullwidth" fusePerfectScrollbar>
+<div id="price-tables" class="page-layout simple fullwidth">
 
     <!-- HEADER -->
     <div class="header" fxLayout="row" fxLayoutAlign="start start">

src/app/main/pages/profile/profile.component.html

@@ -1,4 +1,4 @@
-<div id="profile" class="page-layout simple tabbed" fusePerfectScrollbar>
+<div id="profile" class="page-layout simple tabbed">
 
     <!-- HEADER -->
     <div class="header p-24" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-sm="row"
@@ -7,13 +7,12 @@
         <div class="user-info" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-sm="row"
              fxLayoutAlign.gt-sm="start center">
             <img class="profile-image avatar huge" src="assets/images/avatars/katherine.jpg"
-                 *fuseIfOnDom [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">
+                 [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">
-            <div class="name" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">Katherine Wilson
+            <div class="name" [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">Katherine Wilson
             </div>
         </div>
 
-        <div class="actions" fxLayout="row" fxLayoutAlign="end center" *fuseIfOnDom
+        <div class="actions" fxLayout="row" fxLayoutAlign="end center" [@animate]="{value:'*',params:{delay:'200ms'}}">
-             [@animate]="{value:'*',params:{delay:'200ms'}}">
             <button mat-raised-button color="accent" aria-label="Follow">Follow</button>
             <button mat-raised-button color="primary" aria-label="Send Message">Send Message</button>
         </div>

src/app/main/pages/search/search.component.html

@@ -1,4 +1,4 @@
-<div id="search" class="page-layout simple tabbed" fusePerfectScrollbar>
+<div id="search" class="page-layout simple tabbed">
 
     <!-- HEADER -->
     <div class="header mat-accent-bg p-24" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-sm="row"