Skip to content

Commit 907c110

Browse files
committed
cleanup after rebase
1 parent d08c3c4 commit 907c110

14 files changed

+107
-107
lines changed
Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,24 @@
1-
<md-toolbar color="primary" role="header" aria-label="Basic sidenav app">
2-
<button md-icon-button aria-label="Navigation menu" (click)="snav.toggle()">
3-
<md-icon aria-hidden="true">menu</md-icon>
1+
<mat-toolbar color="primary" role="header" aria-label="Basic sidenav app">
2+
<button mat-icon-button aria-label="Navigation menu" (click)="snav.toggle()">
3+
<mat-icon aria-hidden="true">menu</mat-icon>
44
</button>
55
<h1 class="a11y-demo-sidenav-app-name">Basic Sidenav App</h1>
6-
</md-toolbar>
6+
</mat-toolbar>
77

8-
<md-sidenav-container class="a11y-demo-sidenav-container">
9-
<md-sidenav #snav mode="side" role="navigation">
10-
<md-nav-list>
11-
<a md-list-item routerLink="..">Home</a>
12-
<a md-list-item routerLink="../basic">Basic sidenav example</a>
13-
<a md-list-item routerLink="../mobile">Responsive sidenav example</a>
14-
<a md-list-item routerLink="../dual">Dual sidenavs example</a>
15-
</md-nav-list>
16-
</md-sidenav>
8+
<mat-sidenav-container class="a11y-demo-sidenav-container">
9+
<mat-sidenav #snav mode="side" role="navigation">
10+
<mat-nav-list>
11+
<a mat-list-item routerLink="..">Home</a>
12+
<a mat-list-item routerLink="../basic">Basic sidenav example</a>
13+
<a mat-list-item routerLink="../mobile">Responsive sidenav example</a>
14+
<a mat-list-item routerLink="../dual">Dual sidenavs example</a>
15+
</mat-nav-list>
16+
</mat-sidenav>
1717

18-
<md-sidenav-content role="region">
19-
<button md-raised-button aria-label="Close basic sidenav example" color="primary"
18+
<mat-sidenav-content role="region">
19+
<button mat-raised-button aria-label="Close basic sidenav example" color="primary"
2020
class="a11y-demo-sidenav-close" routerLink="..">
2121
Close example
2222
</button>
23-
</md-sidenav-content>
24-
</md-sidenav-container>
23+
</mat-sidenav-content>
24+
</mat-sidenav-container>

src/demo-app/a11y/sidenav/basic-sidenav-a11y.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,5 +8,6 @@ import {Component, ViewEncapsulation} from '@angular/core';
88
styleUrls: ['shared.css'],
99
host: {'class': 'a11y-demo-sidenav-app'},
1010
encapsulation: ViewEncapsulation.None,
11+
preserveWhitespaces: false,
1112
})
1213
export class SidenavBasicAccessibilityDemo {}
Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,41 @@
1-
<md-toolbar color="primary" role="header" aria-label="Dual sidenav app">
2-
<button md-icon-button aria-label="Navigation menu" (click)="startSnav.toggle()">
3-
<md-icon aria-hidden="true">menu</md-icon>
1+
<mat-toolbar color="primary" role="header" aria-label="Dual sidenav app">
2+
<button mat-icon-button aria-label="Navigation menu" (click)="startSnav.toggle()">
3+
<mat-icon aria-hidden="true">menu</mat-icon>
44
</button>
55
<h1 class="a11y-demo-sidenav-app-name">Dual Sidenav App</h1>
66
<span class="a11y-demo-sidenav-spacer" aria-hidden="true"></span>
7-
<button md-icon-button aria-label="Playlist menu" (click)="endSnav.toggle()">
8-
<md-icon aria-hidden="true">playlist_play</md-icon>
7+
<button mat-icon-button aria-label="Playlist menu" (click)="endSnav.toggle()">
8+
<mat-icon aria-hidden="true">playlist_play</mat-icon>
99
</button>
10-
</md-toolbar>
10+
</mat-toolbar>
1111

12-
<md-sidenav-container class="a11y-demo-sidenav-container">
13-
<md-sidenav #startSnav mode="side" role="navigation">
14-
<md-nav-list>
15-
<a md-list-item routerLink="..">Home</a>
16-
<a md-list-item routerLink="../basic">Basic sidenav example</a>
17-
<a md-list-item routerLink="../mobile">Responsive sidenav example</a>
18-
<a md-list-item routerLink="../dual">Dual sidenavs example</a>
19-
</md-nav-list>
20-
</md-sidenav>
12+
<mat-sidenav-container class="a11y-demo-sidenav-container">
13+
<mat-sidenav #startSnav mode="side" role="navigation">
14+
<mat-nav-list>
15+
<a mat-list-item routerLink="..">Home</a>
16+
<a mat-list-item routerLink="../basic">Basic sidenav example</a>
17+
<a mat-list-item routerLink="../mobile">Responsive sidenav example</a>
18+
<a mat-list-item routerLink="../dual">Dual sidenavs example</a>
19+
</mat-nav-list>
20+
</mat-sidenav>
2121

22-
<md-sidenav-content role="region">
23-
<button md-raised-button aria-label="Close dual sidenav example" color="primary"
22+
<mat-sidenav-content role="region">
23+
<button mat-raised-button aria-label="Close dual sidenav example" color="primary"
2424
class="a11y-demo-sidenav-close" routerLink="..">
2525
Close example
2626
</button>
27-
</md-sidenav-content>
27+
</mat-sidenav-content>
2828

29-
<md-sidenav #endSnav mode="side" position="end" class="a11y-demo-sidenav-playlist" role="region">
29+
<mat-sidenav #endSnav mode="side" position="end" class="a11y-demo-sidenav-playlist" role="region">
3030
<h2 class="a11y-demo-sidenav-playlist-header">Playlists</h2>
31-
<button md-button aria-label="Thumbs up playlist" (click)="play('Thumbs up')">
31+
<button mat-button aria-label="Thumbs up playlist" (click)="play('Thumbs up')">
3232
Thumbs up
3333
</button>
34-
<button md-button aria-label="Last added playlist" (click)="play('Last added')">
34+
<button mat-button aria-label="Last added playlist" (click)="play('Last added')">
3535
Last added
3636
</button>
37-
<button md-button aria-label="Free and purchased playlist" (click)="play('Free and purchased')">
37+
<button mat-button aria-label="Free and purchased playlist" (click)="play('Free and purchased')">
3838
Free and purchased
3939
</button>
40-
</md-sidenav>
41-
</md-sidenav-container>
40+
</mat-sidenav>
41+
</mat-sidenav-container>

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
flex: 1;
33
}
44

5-
md-sidenav.a11y-demo-sidenav-playlist {
5+
mat-sidenav.a11y-demo-sidenav-playlist {
66
display: flex;
77
flex-direction: column;
88
width: 200px;

src/demo-app/a11y/sidenav/dual-sidenav-a11y.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import {Component, ViewEncapsulation} from '@angular/core';
2-
import {MdSnackBar} from '@angular/material';
2+
import {MatSnackBar} from '@angular/material/snack-bar';
33

44

55
@Component({
@@ -9,9 +9,10 @@ import {MdSnackBar} from '@angular/material';
99
styleUrls: ['shared.css', 'dual-sidenav-a11y.css'],
1010
host: {'class': 'a11y-demo-sidenav-app'},
1111
encapsulation: ViewEncapsulation.None,
12+
preserveWhitespaces: false,
1213
})
1314
export class SidenavDualAccessibilityDemo {
14-
constructor(private _snackbar: MdSnackBar) {}
15+
constructor(private _snackbar: MatSnackBar) {}
1516

1617
play(list: string) {
1718
this._snackbar.open(`Playing "${list}"`, '', {duration: 1000});
Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,34 @@
1-
<md-toolbar color="primary" role="header" aria-label="Responsive sidenav app"
1+
<mat-toolbar color="primary" role="header" aria-label="Responsive sidenav app"
22
[class.a11y-demo-sidenav-header-fixed]="mobileQuery.matches">
3-
<button md-icon-button aria-label="Navigation menu" (click)="snav.toggle()">
4-
<md-icon aria-hidden="true">menu</md-icon>
3+
<button mat-icon-button aria-label="Navigation menu" (click)="snav.toggle()">
4+
<mat-icon aria-hidden="true">menu</mat-icon>
55
</button>
66
<h1 class="a11y-demo-sidenav-app-name">Responsive Sidenav App</h1>
7-
</md-toolbar>
7+
</mat-toolbar>
88

9-
<md-sidenav-container
9+
<mat-sidenav-container
1010
class="a11y-demo-sidenav-container"
1111
[class.a11y-demo-sidenav-container-fixed]="mobileQuery.matches"
1212
[style.marginTop.px]="mobileQuery.matches ? 56 : 0">
13-
<md-sidenav
13+
<mat-sidenav
1414
#snav
1515
role="navigation"
1616
[mode]="mobileQuery.matches ? 'over' : 'side'"
1717
[fixedInViewport]="mobileQuery.matches">
18-
<md-nav-list>
19-
<a md-list-item routerLink="..">Home</a>
20-
<a md-list-item routerLink="../basic">Basic sidenav example</a>
21-
<a md-list-item routerLink="../mobile">Responsive sidenav example</a>
22-
<a md-list-item routerLink="../dual">Dual sidenavs example</a>
23-
</md-nav-list>
18+
<mat-nav-list>
19+
<a mat-list-item routerLink="..">Home</a>
20+
<a mat-list-item routerLink="../basic">Basic sidenav example</a>
21+
<a mat-list-item routerLink="../mobile">Responsive sidenav example</a>
22+
<a mat-list-item routerLink="../dual">Dual sidenavs example</a>
23+
</mat-nav-list>
2424
<p class="a11y-demo-sidenav-filler" *ngFor="let f of filler">Filler content</p>
25-
</md-sidenav>
25+
</mat-sidenav>
2626

27-
<md-sidenav-content role="region">
28-
<button md-raised-button aria-label="Close responsive sidenav example" color="primary"
27+
<mat-sidenav-content role="region">
28+
<button mat-raised-button aria-label="Close responsive sidenav example" color="primary"
2929
class="a11y-demo-sidenav-close" routerLink="..">
3030
Close example
3131
</button>
3232
<p class="a11y-demo-sidenav-filler" *ngFor="let f of filler">Filler content</p>
33-
</md-sidenav-content>
34-
</md-sidenav-container>
33+
</mat-sidenav-content>
34+
</mat-sidenav-container>

src/demo-app/a11y/sidenav/mobile-sidenav-a11y.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import {ChangeDetectorRef, Component, OnDestroy, ViewEncapsulation} from '@angul
88
styleUrls: ['shared.css', 'mobile-sidenav-a11y.css'],
99
host: {'class': 'a11y-demo-sidenav-app'},
1010
encapsulation: ViewEncapsulation.None,
11+
preserveWhitespaces: false,
1112
})
1213
export class SidenavMobileAccessibilityDemo implements OnDestroy {
1314
mobileQuery = matchMedia('(max-width: 600px)');
Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
11
<section>
22
<h2>Basic sidenav (e.g. desktop app with hamburger menu)</h2>
3-
<a md-raised-button aria-label="View basic sidenav example" color="primary" routerLink="basic">
3+
<a mat-raised-button aria-label="View basic sidenav example" color="primary" routerLink="basic">
44
View example
55
</a>
66
</section>
77

88
<section>
99
<h2>Mobile sidenav (e.g. responsive design hamburger menu)</h2>
10-
<a md-raised-button aria-label="View mobile sidenav example" color="primary" routerLink="mobile">
10+
<a mat-raised-button aria-label="View mobile sidenav example" color="primary" routerLink="mobile">
1111
View example
1212
</a>
1313
</section>
1414

1515
<section>
1616
<h2>Dual sidenavs (e.g. music app with hamburger menu and playlist sidenav)</h2>
17-
<a md-raised-button aria-label="View dual sidenav example" color="primary" routerLink="dual">
17+
<a mat-raised-button aria-label="View dual sidenav example" color="primary" routerLink="dual">
1818
View example
1919
</a>
2020
</section>

src/demo-app/a11y/sidenav/sidenav-a11y.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,6 @@ import {Component} from '@angular/core';
55
moduleId: module.id,
66
selector: 'sidenav-a11y',
77
templateUrl: 'sidenav-a11y.html',
8+
preserveWhitespaces: false,
89
})
910
export class SidenavAccessibilityDemo {}

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,6 @@ export class DemoApp {
7070
{name: 'Screen Type', route: '/screen-type'},
7171
{name: 'Select', route: '/select'},
7272
{name: 'Sidenav', route: '/sidenav'},
73-
{name: 'Slider', route: '/slider'},
7473
{name: 'Slide Toggle', route: '/slide-toggle'},
7574
{name: 'Slider', route: '/slider'},
7675
{name: 'Snack Bar', route: '/snack-bar'},

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

Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,87 +1,87 @@
11
<h2>Basic Use Case</h2>
22

3-
<md-drawer-container class="demo-drawer-container">
4-
<md-drawer #start (open)="myinput.focus()" mode="side">
3+
<mat-drawer-container class="demo-drawer-container">
4+
<mat-drawer #start (open)="myinput.focus()" mode="side">
55
Start Side Drawer
66
<br>
7-
<button md-button (click)="start.close()">Close</button>
7+
<button mat-button (click)="start.close()">Close</button>
88
<br>
9-
<button md-button (click)="end.open()">Open End Side</button>
9+
<button mat-button (click)="end.open()">Open End Side</button>
1010
<br>
11-
<button md-button
11+
<button mat-button
1212
(click)="start.mode = (start.mode == 'push' ? 'over' : (start.mode == 'over' ? 'side' : 'push'))">Toggle Mode</button>
1313
<div>Mode: {{start.mode}}</div>
1414
<br>
1515
<input #myinput>
16-
</md-drawer>
16+
</mat-drawer>
1717

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

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

2727
<div>
2828
<header>Drawer</header>
29-
<button md-button (click)="start.toggle()">Toggle Start Side Drawer</button>
30-
<button md-button (click)="end.toggle()">Toggle End Side Drawer</button>
29+
<button mat-button (click)="start.toggle()">Toggle Start Side Drawer</button>
30+
<button mat-button (click)="end.toggle()">Toggle End Side Drawer</button>
3131
</div>
3232

33-
<button md-button>HELLO</button>
34-
<button md-raised-button class="mat-primary">HELLO</button>
35-
<button md-fab class="mat-accent">HI</button>
33+
<button mat-button>HELLO</button>
34+
<button mat-raised-button class="mat-primary">HELLO</button>
35+
<button mat-fab class="mat-accent">HI</button>
3636
</div>
37-
</md-drawer-container>
37+
</mat-drawer-container>
3838

3939
<h2>Drawer Already Opened</h2>
4040

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

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

5151
<h2>Dynamic Position Drawer</h2>
5252

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>
53+
<mat-drawer-container class="demo-drawer-container">
54+
<mat-drawer #dynamicPosDrawer1 mode="side" [position]="invert ? 'end' : 'start'">Start</mat-drawer>
55+
<mat-drawer #dynamicPosDrawer2 mode="side" [position]="invert ? 'start' : 'end'">End</mat-drawer>
5656

5757
<div class="demo-drawer-content">
5858
<button (click)="dynamicPosDrawer1.toggle(); dynamicPosDrawer2.toggle()">
5959
Toggle drawers
6060
</button>
6161
<button (click)="invert = !invert">Change sides</button>
6262
</div>
63-
</md-drawer-container>
63+
</mat-drawer-container>
6464

6565
<h2>Drawer with focus attributes</h2>
6666

67-
<md-drawer-container class="demo-drawer-container">
68-
<md-drawer #focusDrawer>
69-
<md-nav-list>
70-
<a md-list-item routerLink>Link</a>
71-
<a md-list-item routerLink cdk-focus-region-start>Focus region start</a>
72-
<a md-list-item routerLink>Link</a>
73-
<a md-list-item routerLink cdk-focus-initial>Initially focused</a>
74-
<a md-list-item routerLink cdk-focus-region-end>Focus region end</a>
75-
<a md-list-item routerLink>Link</a>
76-
</md-nav-list>
77-
</md-drawer>
67+
<mat-drawer-container class="demo-drawer-container">
68+
<mat-drawer #focusDrawer>
69+
<mat-nav-list>
70+
<a mat-list-item routerLink>Link</a>
71+
<a mat-list-item routerLink cdk-focus-region-start>Focus region start</a>
72+
<a mat-list-item routerLink>Link</a>
73+
<a mat-list-item routerLink cdk-focus-initial>Initially focused</a>
74+
<a mat-list-item routerLink cdk-focus-region-end>Focus region end</a>
75+
<a mat-list-item routerLink>Link</a>
76+
</mat-nav-list>
77+
</mat-drawer>
7878

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

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

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {Component, ViewEncapsulation} from '@angular/core';
77
templateUrl: 'drawer-demo.html',
88
styleUrls: ['drawer-demo.css'],
99
encapsulation: ViewEncapsulation.None,
10+
preserveWhitespaces: false,
1011
})
1112
export class DrawerDemo {
1213
invert = false;

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {Component, ViewEncapsulation} from '@angular/core';
77
templateUrl: 'sidenav-demo.html',
88
styleUrls: ['sidenav-demo.css'],
99
encapsulation: ViewEncapsulation.None,
10+
preserveWhitespaces: false,
1011
})
1112
export class SidenavDemo {
1213
isLaunched = false;

src/lib/sidenav/drawer.scss

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,6 @@ $mat-drawer-side-drawer-z-index: 2;
88
$mat-drawer-backdrop-z-index: 3;
99
$mat-drawer-over-drawer-z-index: 4;
1010

11-
$mat-drawer-content-z-index: 1;
12-
$mat-drawer-side-drawer-z-index: 2;
13-
$mat-drawer-backdrop-z-index: 3;
14-
$mat-drawer-over-drawer-z-index: 4;
15-
1611
// stylelint-disable max-line-length
1712
// Mixin that creates a new stacking context.
1813
// see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context

0 commit comments

Comments
 (0)