Skip to content

Commit 26e8c90

Browse files
committed
change sidenav demo to drawer
1 parent 3c115e1 commit 26e8c90

File tree

7 files changed

+46
-50
lines changed

7 files changed

+46
-50
lines changed

src/demo-app/demo-app/demo-app.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@ export class DemoApp {
5353
{name: 'Checkbox', route: '/checkbox'},
5454
{name: 'Datepicker', route: '/datepicker'},
5555
{name: 'Dialog', route: '/dialog'},
56+
{name: 'Drawer', route: '/drawer'},
5657
{name: 'Expansion Panel', route: '/expansion'},
5758
{name: 'Gestures', route: '/gestures'},
5859
{name: 'Grid List', route: '/grid-list'},
@@ -68,7 +69,6 @@ export class DemoApp {
6869
{name: 'Radio', route: '/radio'},
6970
{name: 'Ripple', route: '/ripple'},
7071
{name: 'Select', route: '/select'},
71-
{name: 'Sidenav', route: '/sidenav'},
7272
{name: 'Slider', route: '/slider'},
7373
{name: 'Slide Toggle', route: '/slide-toggle'},
7474
{name: 'Snack Bar', route: '/snack-bar'},

src/demo-app/demo-app/demo-module.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ import {ButtonDemo} from '../button/button-demo';
2626
import {CheckboxDemo, MdCheckboxDemoNestedChecklist} from '../checkbox/checkbox-demo';
2727
import {SelectDemo} from '../select/select-demo';
2828
import {SliderDemo} from '../slider/slider-demo';
29-
import {SidenavDemo} from '../sidenav/sidenav-demo';
29+
import {DrawerDemo} from '../drawer/drawer-demo';
3030
import {SnackBarDemo} from '../snack-bar/snack-bar-demo';
3131
import {PortalDemo, ScienceJoke} from '../portal/portal-demo';
3232
import {MenuDemo} from '../menu/menu-demo';
@@ -88,7 +88,7 @@ import {TableHeaderDemo} from '../table/table-header-demo';
8888
RotiniPanel,
8989
ScienceJoke,
9090
SelectDemo,
91-
SidenavDemo,
91+
DrawerDemo,
9292
SliderDemo,
9393
SlideToggleDemo,
9494
SpagettiPanel,

src/demo-app/demo-app/routes.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import {PortalDemo} from '../portal/portal-demo';
1616
import {ProgressBarDemo} from '../progress-bar/progress-bar-demo';
1717
import {ProgressSpinnerDemo} from '../progress-spinner/progress-spinner-demo';
1818
import {SelectDemo} from '../select/select-demo';
19-
import {SidenavDemo} from '../sidenav/sidenav-demo';
19+
import {DrawerDemo} from '../drawer/drawer-demo';
2020
import {SlideToggleDemo} from '../slide-toggle/slide-toggle-demo';
2121
import {SliderDemo} from '../slider/slider-demo';
2222
import {RadioDemo} from '../radio/radio-demo';
@@ -51,7 +51,7 @@ export const DEMO_APP_ROUTES: Routes = [
5151
{path: 'datepicker', component: DatepickerDemo},
5252
{path: 'radio', component: RadioDemo},
5353
{path: 'select', component: SelectDemo},
54-
{path: 'sidenav', component: SidenavDemo},
54+
{path: 'drawer', component: DrawerDemo},
5555
{path: 'slide-toggle', component: SlideToggleDemo},
5656
{path: 'slider', component: SliderDemo},
5757
{path: 'progress-spinner', component: ProgressSpinnerDemo},
Lines changed: 30 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<h2>Basic Use Case</h2>
22

3-
<md-sidenav-container class="demo-sidenav-container">
4-
<md-sidenav #start (open)="myinput.focus()" mode="side">
3+
<md-drawer-container class="demo-drawer-container">
4+
<md-drawer #start (open)="myinput.focus()" mode="side">
55
Start Side Drawer
66
<br>
77
<button md-button (click)="start.close()">Close</button>
@@ -13,19 +13,19 @@ <h2>Basic Use Case</h2>
1313
<div>Mode: {{start.mode}}</div>
1414
<br>
1515
<input #myinput>
16-
</md-sidenav>
16+
</md-drawer>
1717

18-
<md-sidenav #end position="end">
18+
<md-drawer #end position="end">
1919
End Side Drawer
2020
<br>
2121
<button md-button (click)="end.close()">Close</button>
22-
</md-sidenav>
22+
</md-drawer>
2323

24-
<div class="demo-sidenav-content">
24+
<div class="demo-drawer-content">
2525
<h1>My Content</h1>
2626

2727
<div>
28-
<header>Sidenav</header>
28+
<header>Drawer</header>
2929
<button md-button (click)="start.toggle()">Toggle Start Side Drawer</button>
3030
<button md-button (click)="end.toggle()">Toggle End Side Drawer</button>
3131
</div>
@@ -34,38 +34,38 @@ <h1>My Content</h1>
3434
<button md-raised-button class="mat-primary">HELLO</button>
3535
<button md-fab class="mat-accent">HI</button>
3636
</div>
37-
</md-sidenav-container>
37+
</md-drawer-container>
3838

39-
<h2>Sidenav Already Opened</h2>
39+
<h2>Drawer Already Opened</h2>
4040

41-
<md-sidenav-container class="demo-sidenav-container">
42-
<md-sidenav #start2 opened mode="side">
41+
<md-drawer-container class="demo-drawer-container">
42+
<md-drawer #start2 opened mode="side">
4343
Drawer
44-
</md-sidenav>
44+
</md-drawer>
4545

46-
<div class="demo-sidenav-content">
46+
<div class="demo-drawer-content">
4747
<button md-button (click)="start2.toggle()">Toggle Start Side Drawer</button>
4848
</div>
49-
</md-sidenav-container>
49+
</md-drawer-container>
5050

51-
<h2>Dynamic Position Sidenav</h2>
51+
<h2>Dynamic Position Drawer</h2>
5252

53-
<md-sidenav-container class="demo-sidenav-container">
54-
<md-sidenav #dynamicPosSidenav1 mode="side" [position]="invert ? 'end' : 'start'">Start</md-sidenav>
55-
<md-sidenav #dynamicPosSidenav2 mode="side" [position]="invert ? 'start' : 'end'">End</md-sidenav>
53+
<md-drawer-container class="demo-drawer-container">
54+
<md-drawer #dynamicPosDrawer1 mode="side" [position]="invert ? 'end' : 'start'">Start</md-drawer>
55+
<md-drawer #dynamicPosDrawer2 mode="side" [position]="invert ? 'start' : 'end'">End</md-drawer>
5656

57-
<div class="demo-sidenav-content">
58-
<button (click)="dynamicPosSidenav1.toggle(); dynamicPosSidenav2.toggle()">
59-
Toggle sidenavs
57+
<div class="demo-drawer-content">
58+
<button (click)="dynamicPosDrawer1.toggle(); dynamicPosDrawer2.toggle()">
59+
Toggle drawers
6060
</button>
6161
<button (click)="invert = !invert">Change sides</button>
6262
</div>
63-
</md-sidenav-container>
63+
</md-drawer-container>
6464

65-
<h2>Sidenav with focus attributes</h2>
65+
<h2>Drawer with focus attributes</h2>
6666

67-
<md-sidenav-container class="demo-sidenav-container">
68-
<md-sidenav #focusSidenav>
67+
<md-drawer-container class="demo-drawer-container">
68+
<md-drawer #focusDrawer>
6969
<md-nav-list>
7070
<a md-list-item routerLink>Link</a>
7171
<a md-list-item routerLink cdk-focus-region-start>Focus region start</a>
@@ -74,14 +74,14 @@ <h2>Sidenav with focus attributes</h2>
7474
<a md-list-item routerLink cdk-focus-region-end>Focus region end</a>
7575
<a md-list-item routerLink>Link</a>
7676
</md-nav-list>
77-
</md-sidenav>
77+
</md-drawer>
7878

79-
<div class="demo-sidenav-content">
79+
<div class="demo-drawer-content">
8080
<h1>My Content</h1>
8181

8282
<div>
83-
<header>Sidenav</header>
84-
<button md-button (click)="focusSidenav.toggle()">Toggle Drawer</button>
83+
<header>Drawer</header>
84+
<button md-button (click)="focusDrawer.toggle()">Toggle Drawer</button>
8585
</div>
8686
</div>
87-
</md-sidenav-container>
87+
</md-drawer-container>

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

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
.demo-drawer-container {
2+
border: 3px solid black;
3+
}
4+
5+
.demo-drawer-content {
6+
padding: 15px;
7+
}

src/demo-app/sidenav/sidenav-demo.ts renamed to src/demo-app/drawer/drawer-demo.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@ import {Component, ViewEncapsulation} from '@angular/core';
33

44
@Component({
55
moduleId: module.id,
6-
selector: 'sidenav-demo',
7-
templateUrl: 'sidenav-demo.html',
8-
styleUrls: ['sidenav-demo.css'],
6+
selector: 'drawer-demo',
7+
templateUrl: 'drawer-demo.html',
8+
styleUrls: ['drawer-demo.css'],
99
encapsulation: ViewEncapsulation.None,
1010
})
11-
export class SidenavDemo {
11+
export class DrawerDemo {
1212
invert = false;
1313
}

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

Lines changed: 0 additions & 11 deletions
This file was deleted.

0 commit comments

Comments
 (0)