mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
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:
committed by
Jeremy Elbourn
parent
dd7421db6c
commit
40ff3f9a5e
@@ -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"
|
||||
|
||||
@@ -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%;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user