mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-01-11 04:55:07 +00:00
32 lines
805 B
CSS
32 lines
805 B
CSS
|
.example-container {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.example-is-mobile .example-toolbar {
|
||
|
|
position: fixed;
|
||
|
|
/* Make sure the toolbar will stay on top of the content as it scrolls past. */
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
|
||
|
|
h1.example-app-name {
|
||
|
|
margin-left: 8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.example-sidenav-container {
|
||
|
|
/* When the sidenav is not fixed, stretch the sidenav container to fill the available space. This
|
||
|
|
causes `<mat-sidenav-content>` to act as our scrolling element for desktop layouts. */
|
||
|
|
flex: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.example-is-mobile .example-sidenav-container {
|
||
|
|
/* When the sidenav is fixed, don't constrain the height of the sidenav container. This allows the
|
||
|
|
`<body>` to be our scrolling element for mobile layouts. */
|
||
|
|
flex: 1 0 auto;
|
||
|
|
}
|