mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-01-10 04:25:08 +00:00
Page layout tweaks
Removed body color class
This commit is contained in:
parent
5bf9fd177b
commit
20f80e3fe4
|
@ -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;
|
||||
|
||||
|
|
|
@ -9,4 +9,5 @@ body {
|
|||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
background: #F5F5F5;
|
||||
}
|
|
@ -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;
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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">
|
||||
|
|
Loading…
Reference in New Issue
Block a user