mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
chore(demos): fix sidenav styles
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
<md-sidenav-layout>
|
||||
<md-sidenav-layout class="demo-root">
|
||||
<md-sidenav #start>
|
||||
<md-nav-list>
|
||||
<a md-list-item [routerLink]="['ButtonDemo']">Button</a>
|
||||
@@ -17,9 +17,9 @@
|
||||
<a md-list-item [routerLink]="['SidenavDemo']">Sidenav</a>
|
||||
<a md-list-item [routerLink]="['ToolbarDemo']">Toolbar</a>
|
||||
</md-nav-list>
|
||||
<button md-raised-button (click)="start.close()">CLOSE</button>
|
||||
<button md-button (click)="start.close()">CLOSE</button>
|
||||
</md-sidenav>
|
||||
<div class="demo-root">
|
||||
<div>
|
||||
|
||||
<md-toolbar color="primary">
|
||||
<i class="material-icons" (click)="start.open()">menu</i>
|
||||
|
||||
@@ -1,7 +1,10 @@
|
||||
.demo-root {
|
||||
font-family: Roboto, 'Helvetica Neue', sans-serif;
|
||||
padding: 20px;
|
||||
min-height: 1000px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
|
||||
// Helps fonts on OSX looks more consistent with other systems
|
||||
// Isn't currently in button styles due to performance concerns
|
||||
@@ -10,6 +13,21 @@
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
md-sidenav {
|
||||
width: 15%;
|
||||
|
||||
[md-button] {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.demo-content {
|
||||
padding: 32px;
|
||||
}
|
||||
|
||||
md-toolbar {
|
||||
i {
|
||||
padding: 20px;
|
||||
@@ -30,9 +48,5 @@
|
||||
h1 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.demo-content {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user