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.

Author: crisbeto

src/demo-app/demo-app/demo-app.html

@@ -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"

src/demo-app/demo-app/demo-app.scss

@@ -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%;
+}