build: make body scrollable element in demo (#12093)

Reworks the demo to make the `body` the scrollable element. Currently we have the `mat-sidenav-content` be scrollable which doesn't reflect the setup in most apps and makes it harder to test some cases, because of some things like the overlay backdrop blocking scrolling.
This commit is contained in:
Kristiyan Kostadinov
2018-07-11 17:19:43 +02:00
committed by Jeremy Elbourn
parent dd7421db6c
commit 40ff3f9a5e
2 changed files with 13 additions and 1 deletions
+1 -1
View File
@@ -1,4 +1,4 @@
<mat-sidenav-container fullscreen>
<mat-sidenav-container class="demo-container">
<mat-sidenav #start>
<mat-nav-list>
<a *ngFor="let navItem of navItems"
+12
View File
@@ -1,5 +1,11 @@
html, body {
width: 100%;
height: 100%;
}
body {
font-family: Roboto, 'Helvetica Neue', sans-serif;
margin: 0;
// Helps fonts on OSX looks more consistent with other systems
// Isn't currently in button styles due to performance concerns
@@ -10,6 +16,7 @@ body {
.mat-sidenav {
min-width: 15vw;
position: fixed;
.mat-button {
width: 100%;
@@ -48,3 +55,8 @@ body {
height: 100%;
box-sizing: border-box;
}
.demo-container {
min-width: 100%;
min-height: 100%;
}