From 20f80e3fe4adae8a0037a847a223304ec95468bb Mon Sep 17 00:00:00 2001
From: Sercan Yemen <sercanyemen@gmail.com>
Date: Tue, 12 Jun 2018 12:09:00 +0300
Subject: [PATCH] Page layout tweaks Removed body color class

---
 .../components/sidebar/sidebar.component.scss      |  2 +-
 src/@fuse/scss/partials/_global.scss               |  1 +
 src/@fuse/scss/partials/_page-layouts.scss         | 14 ++++++++------
 .../layout/components/navbar/navbar.component.scss |  4 +++-
 .../left-sidebar-tabbed-1.component.html           |  2 +-
 .../left-sidebar-tabbed-2.component.html           |  2 +-
 .../right-sidebar-tabbed-1.component.html          |  2 +-
 .../right-sidebar-tabbed-2.component.html          |  2 +-
 .../main/ui/page-layouts/page-layouts.module.ts    |  3 +--
 .../left-sidebar-3/left-sidebar-3.component.html   |  2 +-
 .../left-sidebar-4/left-sidebar-4.component.html   |  2 +-
 .../right-sidebar-3/right-sidebar-3.component.html |  2 +-
 .../right-sidebar-4/right-sidebar-4.component.html |  2 +-
 src/index.html                                     |  2 +-
 14 files changed, 23 insertions(+), 19 deletions(-)

diff --git a/src/@fuse/components/sidebar/sidebar.component.scss b/src/@fuse/components/sidebar/sidebar.component.scss
index 9a3c1005..0005a506 100644
--- a/src/@fuse/components/sidebar/sidebar.component.scss
+++ b/src/@fuse/components/sidebar/sidebar.component.scss
@@ -58,7 +58,7 @@ fuse-sidebar {
     bottom: 0;
     left: 0;
     right: 0;
-    z-index: 3;
+    z-index: 999;
     background-color: rgba(0, 0, 0, 0.6);
     opacity: 0;
 
diff --git a/src/@fuse/scss/partials/_global.scss b/src/@fuse/scss/partials/_global.scss
index fad46620..c54af974 100644
--- a/src/@fuse/scss/partials/_global.scss
+++ b/src/@fuse/scss/partials/_global.scss
@@ -9,4 +9,5 @@ body {
     margin: 0;
     padding: 0;
     overflow: hidden;
+    background: #F5F5F5;
 }
\ No newline at end of file
diff --git a/src/@fuse/scss/partials/_page-layouts.scss b/src/@fuse/scss/partials/_page-layouts.scss
index e2da2bf5..a9d306a7 100644
--- a/src/@fuse/scss/partials/_page-layouts.scss
+++ b/src/@fuse/scss/partials/_page-layouts.scss
@@ -191,7 +191,6 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
                 min-width: 240px;
                 max-width: 240px;
                 height: auto;
-                z-index: 4;
                 overflow: hidden;
                 @include mat-elevation(7);
 
@@ -200,7 +199,7 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
                     box-shadow: none;
 
                     + .center {
-                        z-index: 5;
+                        z-index: 1001;
                     }
 
                     &.left-positioned {
@@ -439,7 +438,6 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
                 width: 240px;
                 min-width: 240px;
                 max-width: 240px;
-                z-index: 4;
                 overflow: hidden;
                 @include mat-elevation(7);
 
@@ -448,7 +446,7 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
                     box-shadow: none;
 
                     + .center {
-                        z-index: 5;
+                        z-index: 1001;
                     }
 
                     &.left-positioned {
@@ -516,10 +514,14 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
 
                 > .content {
                     display: flex;
+                    min-height: 0;
 
                     > .sidebar {
-                        background: none;
-                        box-shadow: none;
+
+                        &.locked-open {
+                            background: none;
+                            box-shadow: none;
+                        }
 
                         .content {
                             overflow: auto;
diff --git a/src/app/layout/components/navbar/navbar.component.scss b/src/app/layout/components/navbar/navbar.component.scss
index 8bd2d7ba..fc111989 100644
--- a/src/app/layout/components/navbar/navbar.component.scss
+++ b/src/app/layout/components/navbar/navbar.component.scss
@@ -25,6 +25,7 @@ navbar {
 
     &:not(.top-navbar) {
         height: 100%;
+        overflow: hidden;
     }
 
     .navbar-vertical {
@@ -63,7 +64,8 @@ navbar {
         }
 
         .navbar-content {
-            flex: 1;
+            flex: 1 1 auto;
+            overflow-y: auto;
         }
     }
 
diff --git a/src/app/main/ui/page-layouts/carded/left-sidebar-tabbed-1/left-sidebar-tabbed-1.component.html b/src/app/main/ui/page-layouts/carded/left-sidebar-tabbed-1/left-sidebar-tabbed-1.component.html
index 2dc6e8ed..671c54a6 100644
--- a/src/app/main/ui/page-layouts/carded/left-sidebar-tabbed-1/left-sidebar-tabbed-1.component.html
+++ b/src/app/main/ui/page-layouts/carded/left-sidebar-tabbed-1/left-sidebar-tabbed-1.component.html
@@ -35,7 +35,7 @@
                     <mat-icon>menu</mat-icon>
                 </button>
 
-                <h2 class="m-0">Left sidenav with tabs and content scroll</h2>
+                <h2 class="m-0">Left sidebar with tabs and content scroll</h2>
 
             </div>
 
diff --git a/src/app/main/ui/page-layouts/carded/left-sidebar-tabbed-2/left-sidebar-tabbed-2.component.html b/src/app/main/ui/page-layouts/carded/left-sidebar-tabbed-2/left-sidebar-tabbed-2.component.html
index da617692..5c138941 100644
--- a/src/app/main/ui/page-layouts/carded/left-sidebar-tabbed-2/left-sidebar-tabbed-2.component.html
+++ b/src/app/main/ui/page-layouts/carded/left-sidebar-tabbed-2/left-sidebar-tabbed-2.component.html
@@ -35,7 +35,7 @@
                     <mat-icon>menu</mat-icon>
                 </button>
 
-                <h2 class="m-0">Left sidenav with tabs and inner scroll</h2>
+                <h2 class="m-0">Left sidebar with tabs and inner scroll</h2>
 
             </div>
 
diff --git a/src/app/main/ui/page-layouts/carded/right-sidebar-tabbed-1/right-sidebar-tabbed-1.component.html b/src/app/main/ui/page-layouts/carded/right-sidebar-tabbed-1/right-sidebar-tabbed-1.component.html
index 28de515f..3c67bed4 100644
--- a/src/app/main/ui/page-layouts/carded/right-sidebar-tabbed-1/right-sidebar-tabbed-1.component.html
+++ b/src/app/main/ui/page-layouts/carded/right-sidebar-tabbed-1/right-sidebar-tabbed-1.component.html
@@ -35,7 +35,7 @@
                     <mat-icon>menu</mat-icon>
                 </button>
 
-                <h2 class="m-0">Right sidenav with tabs and content scroll</h2>
+                <h2 class="m-0">Right sidebar with tabs and content scroll</h2>
 
             </div>
 
diff --git a/src/app/main/ui/page-layouts/carded/right-sidebar-tabbed-2/right-sidebar-tabbed-2.component.html b/src/app/main/ui/page-layouts/carded/right-sidebar-tabbed-2/right-sidebar-tabbed-2.component.html
index 7c701585..9de17b71 100644
--- a/src/app/main/ui/page-layouts/carded/right-sidebar-tabbed-2/right-sidebar-tabbed-2.component.html
+++ b/src/app/main/ui/page-layouts/carded/right-sidebar-tabbed-2/right-sidebar-tabbed-2.component.html
@@ -35,7 +35,7 @@
                     <mat-icon>menu</mat-icon>
                 </button>
 
-                <h2 class="m-0">Right sidenav with tabs and inner scroll</h2>
+                <h2 class="m-0">Right sidebar with tabs and inner scroll</h2>
 
             </div>
 
diff --git a/src/app/main/ui/page-layouts/page-layouts.module.ts b/src/app/main/ui/page-layouts/page-layouts.module.ts
index 81a383e0..9c21e745 100644
--- a/src/app/main/ui/page-layouts/page-layouts.module.ts
+++ b/src/app/main/ui/page-layouts/page-layouts.module.ts
@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
-import { MatButtonModule, MatIconModule, MatSidenavModule, MatTabsModule } from '@angular/material';
+import { MatButtonModule, MatIconModule, MatTabsModule } from '@angular/material';
 
 import { FuseSharedModule } from '@fuse/shared.module';
 import { FuseDemoModule } from '@fuse/components/demo/demo.module';
@@ -160,7 +160,6 @@ const routes: Routes = [
 
         MatButtonModule,
         MatIconModule,
-        MatSidenavModule,
         MatTabsModule,
 
         FuseSidebarModule,
diff --git a/src/app/main/ui/page-layouts/simple/left-sidebar-3/left-sidebar-3.component.html b/src/app/main/ui/page-layouts/simple/left-sidebar-3/left-sidebar-3.component.html
index e070e897..ba0b8580 100644
--- a/src/app/main/ui/page-layouts/simple/left-sidebar-3/left-sidebar-3.component.html
+++ b/src/app/main/ui/page-layouts/simple/left-sidebar-3/left-sidebar-3.component.html
@@ -4,7 +4,7 @@
     <div class="header mat-accent-bg p-24" fxLayout="row" fxLayoutAlign="start center">
 
         <button mat-icon-button class="sidebar-toggle mr-8" fxHide.gt-md
-                (click)="toggleSidebar('simple-left-sidebar-4')">
+                (click)="toggleSidebar('simple-left-sidebar-3')">
             <mat-icon>menu</mat-icon>
         </button>
 
diff --git a/src/app/main/ui/page-layouts/simple/left-sidebar-4/left-sidebar-4.component.html b/src/app/main/ui/page-layouts/simple/left-sidebar-4/left-sidebar-4.component.html
index e75eb3d7..52596e3e 100644
--- a/src/app/main/ui/page-layouts/simple/left-sidebar-4/left-sidebar-4.component.html
+++ b/src/app/main/ui/page-layouts/simple/left-sidebar-4/left-sidebar-4.component.html
@@ -19,7 +19,7 @@
     <div class="content">
 
         <!-- SIDEBAR -->
-        <fuse-sidebar class="sidebar" name="simple-left-sidebar-3" position="left" lockedOpen="gt-md">
+        <fuse-sidebar class="sidebar" name="simple-left-sidebar-4" position="left" lockedOpen="gt-md">
 
             <!-- SIDEBAR CONTENT -->
             <div class="content p-24" fusePerfectScrollbar>
diff --git a/src/app/main/ui/page-layouts/simple/right-sidebar-3/right-sidebar-3.component.html b/src/app/main/ui/page-layouts/simple/right-sidebar-3/right-sidebar-3.component.html
index 5991f954..9a2aa27d 100644
--- a/src/app/main/ui/page-layouts/simple/right-sidebar-3/right-sidebar-3.component.html
+++ b/src/app/main/ui/page-layouts/simple/right-sidebar-3/right-sidebar-3.component.html
@@ -4,7 +4,7 @@
     <div class="header mat-accent-bg p-24" fxLayout="row" fxLayoutAlign="start center">
 
         <button mat-icon-button class="sidebar-toggle mr-8" fxHide.gt-md
-                (click)="toggleSidebar('simple-right-sidebar-4')">
+                (click)="toggleSidebar('simple-right-sidebar-3')">
             <mat-icon>menu</mat-icon>
         </button>
 
diff --git a/src/app/main/ui/page-layouts/simple/right-sidebar-4/right-sidebar-4.component.html b/src/app/main/ui/page-layouts/simple/right-sidebar-4/right-sidebar-4.component.html
index ac4506c5..75b0c8b2 100644
--- a/src/app/main/ui/page-layouts/simple/right-sidebar-4/right-sidebar-4.component.html
+++ b/src/app/main/ui/page-layouts/simple/right-sidebar-4/right-sidebar-4.component.html
@@ -19,7 +19,7 @@
     <div class="content">
 
         <!-- SIDEBAR -->
-        <fuse-sidebar class="sidebar" name="simple-right-sidebar-3" position="left" lockedOpen="gt-md">
+        <fuse-sidebar class="sidebar" name="simple-right-sidebar-4" position="left" lockedOpen="gt-md">
 
             <!-- SIDEBAR CONTENT -->
             <div class="content p-24" fusePerfectScrollbar>
diff --git a/src/index.html b/src/index.html
index be771e3b..534f3c25 100644
--- a/src/index.html
+++ b/src/index.html
@@ -181,7 +181,7 @@
         <!-- / FUSE Splash Screen CSS -->
     </head>
 
-    <body class="mat-grey-100-bg">
+    <body>
 
         <!-- FUSE Splash Screen -->
         <fuse-splash-screen id="fuse-splash-screen">