diff --git a/aio/src/app/app.component.spec.ts b/aio/src/app/app.component.spec.ts
index 59201c3ab3..40edfdf4e5 100644
--- a/aio/src/app/app.component.spec.ts
+++ b/aio/src/app/app.component.spec.ts
@@ -3,7 +3,7 @@ import { inject, ComponentFixture, TestBed, fakeAsync, tick } from '@angular/cor
import { Title } from '@angular/platform-browser';
import { APP_BASE_HREF } from '@angular/common';
import { HttpClient } from '@angular/common/http';
-import { MdProgressBar, MdSidenav } from '@angular/material';
+import { MatProgressBar, MatSidenav } from '@angular/material';
import { By } from '@angular/platform-browser';
import { of } from 'rxjs/observable/of';
@@ -51,7 +51,7 @@ describe('AppComponent', () => {
docViewer = de.query(By.css('aio-doc-viewer')).nativeElement;
hamburger = de.query(By.css('.hamburger')).nativeElement;
locationService = de.injector.get(LocationService) as any as MockLocationService;
- sidenav = de.query(By.css('md-sidenav')).nativeElement;
+ sidenav = de.query(By.css('mat-sidenav')).nativeElement;
tocService = de.injector.get(TocService);
};
@@ -376,7 +376,7 @@ describe('AppComponent', () => {
});
it('should set the css class of the host container based on the open/closed state of the side nav', () => {
- const sideNav = fixture.debugElement.query(By.directive(MdSidenav));
+ const sideNav = fixture.debugElement.query(By.directive(MatSidenav));
locationService.go('guide/pipes');
fixture.detectChanges();
@@ -882,7 +882,7 @@ describe('AppComponent', () => {
describe('initial rendering', () => {
it('should initially add the starting class until the first document is rendered', fakeAsync(() => {
- const getSidenavContainer = () => fixture.debugElement.query(By.css('md-sidenav-container'));
+ const getSidenavContainer = () => fixture.debugElement.query(By.css('mat-sidenav-container'));
initializeTest();
@@ -909,7 +909,7 @@ describe('AppComponent', () => {
describe('progress bar', () => {
const SHOW_DELAY = 200;
const HIDE_DELAY = 500;
- const getProgressBar = () => fixture.debugElement.query(By.directive(MdProgressBar));
+ const getProgressBar = () => fixture.debugElement.query(By.directive(MatProgressBar));
const initializeAndCompleteNavigation = () => {
initializeTest();
triggerDocRendered();
diff --git a/aio/src/app/app.component.ts b/aio/src/app/app.component.ts
index b950d23323..377088813a 100644
--- a/aio/src/app/app.component.ts
+++ b/aio/src/app/app.component.ts
@@ -1,6 +1,6 @@
import { Component, ElementRef, HostBinding, HostListener, OnInit,
QueryList, ViewChild, ViewChildren } from '@angular/core';
-import { MdSidenav } from '@angular/material';
+import { MatSidenav } from '@angular/material';
import { CurrentNodes, NavigationService, NavigationNode, VersionInfo } from 'app/navigation/navigation.service';
import { DocumentService, DocumentContents } from 'app/documents/document.service';
@@ -95,8 +95,8 @@ export class AppComponent implements OnInit {
@ViewChild(SearchBoxComponent)
searchBox: SearchBoxComponent;
- @ViewChild(MdSidenav)
- sidenav: MdSidenav;
+ @ViewChild(MatSidenav)
+ sidenav: MatSidenav;
constructor(
public deployment: Deployment,
@@ -291,7 +291,7 @@ export class AppComponent implements OnInit {
const el = this.hostElement.nativeElement as Element;
this.tocMaxHeightOffset =
el.querySelector('footer').clientHeight +
- el.querySelector('md-toolbar.app-toolbar').clientHeight +
+ el.querySelector('mat-toolbar.app-toolbar').clientHeight +
24; // fudge margin
}
diff --git a/aio/src/app/app.module.ts b/aio/src/app/app.module.ts
index 671ef5f10c..32181ba900 100644
--- a/aio/src/app/app.module.ts
+++ b/aio/src/app/app.module.ts
@@ -6,14 +6,14 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { Location, LocationStrategy, PathLocationStrategy } from '@angular/common';
import {
- MdButtonModule,
- MdIconModule,
- MdIconRegistry,
- MdInputModule,
- MdProgressBarModule,
- MdSidenavModule,
- MdTabsModule,
- MdToolbarModule,
+ MatButtonModule,
+ MatIconModule,
+ MatIconRegistry,
+ MatInputModule,
+ MatProgressBarModule,
+ MatSidenavModule,
+ MatTabsModule,
+ MatToolbarModule,
Platform
} from '@angular/material';
@@ -77,13 +77,13 @@ export const svgIconProviders = [
EmbeddedModule,
HttpClientModule,
BrowserAnimationsModule,
- MdButtonModule,
- MdIconModule,
- MdInputModule,
- MdProgressBarModule,
- MdSidenavModule,
- MdTabsModule,
- MdToolbarModule,
+ MatButtonModule,
+ MatIconModule,
+ MatInputModule,
+ MatProgressBarModule,
+ MatSidenavModule,
+ MatTabsModule,
+ MatToolbarModule,
SwUpdatesModule,
SharedModule
],
@@ -107,7 +107,7 @@ export const svgIconProviders = [
Location,
{ provide: LocationStrategy, useClass: PathLocationStrategy },
LocationService,
- { provide: MdIconRegistry, useClass: CustomMdIconRegistry },
+ { provide: MatIconRegistry, useClass: CustomMdIconRegistry },
NavigationService,
Platform,
ScrollService,
diff --git a/aio/src/app/embedded/code/code-tabs.component.spec.ts b/aio/src/app/embedded/code/code-tabs.component.spec.ts
index bfc7a145ec..6e8993c139 100644
--- a/aio/src/app/embedded/code/code-tabs.component.spec.ts
+++ b/aio/src/app/embedded/code/code-tabs.component.spec.ts
@@ -1,7 +1,7 @@
import { CommonModule } from '@angular/common';
import { Component, DebugElement, Input, NO_ERRORS_SCHEMA } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MdTabGroup, MdTabsModule } from '@angular/material';
+import { MatTabGroup, MatTabsModule } from '@angular/material';
import { By } from '@angular/platform-browser';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@@ -50,7 +50,7 @@ describe('CodeTabsComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
- imports: [ MdTabsModule, NoopAnimationsModule ]
+ imports: [ MatTabsModule, NoopAnimationsModule ]
});
});
@@ -86,7 +86,7 @@ describe('CodeTabsComponent', () => {
it('should disable ripple effect on tab labels', () => {
createComponent();
- const tabsGroupComponent = codeTabsDe.query(By.directive(MdTabGroup)).componentInstance;
+ const tabsGroupComponent = codeTabsDe.query(By.directive(MatTabGroup)).componentInstance;
expect(tabsGroupComponent.disableRipple).toBe(true);
});
diff --git a/aio/src/app/embedded/code/code-tabs.component.ts b/aio/src/app/embedded/code/code-tabs.component.ts
index ef7b3b6c4b..2a726d01fa 100644
--- a/aio/src/app/embedded/code/code-tabs.component.ts
+++ b/aio/src/app/embedded/code/code-tabs.component.ts
@@ -21,9 +21,9 @@ export interface TabInfo {
@Component({
selector: 'code-tabs',
template: `
-
-
-
+
+
+
{{ tab.title }}
-
-
+
+
`
})
export class CodeTabsComponent implements OnInit {
diff --git a/aio/src/app/embedded/code/code.component.spec.ts b/aio/src/app/embedded/code/code.component.spec.ts
index ad0496e935..c8ca662479 100644
--- a/aio/src/app/embedded/code/code.component.spec.ts
+++ b/aio/src/app/embedded/code/code.component.spec.ts
@@ -1,6 +1,6 @@
import { Component, DebugElement } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { MdSnackBarModule, MdSnackBar } from '@angular/material';
+import { MatSnackBarModule, MatSnackBar } from '@angular/material';
import { By } from '@angular/platform-browser';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@@ -42,7 +42,7 @@ describe('CodeComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
- imports: [ MdSnackBarModule, NoopAnimationsModule ],
+ imports: [ MatSnackBarModule, NoopAnimationsModule ],
declarations: [ CodeComponent, HostComponent ],
providers: [
PrettyPrinter,
@@ -243,7 +243,7 @@ describe('CodeComponent', () => {
});
it('should display a message when copy succeeds', () => {
- const snackBar: MdSnackBar = TestBed.get(MdSnackBar);
+ const snackBar: MatSnackBar = TestBed.get(MatSnackBar);
const copierService: CopierService = TestBed.get(CopierService);
spyOn(snackBar, 'open');
spyOn(copierService, 'copyText').and.returnValue(true);
@@ -252,7 +252,7 @@ describe('CodeComponent', () => {
});
it('should display an error when copy fails', () => {
- const snackBar: MdSnackBar = TestBed.get(MdSnackBar);
+ const snackBar: MatSnackBar = TestBed.get(MatSnackBar);
const copierService: CopierService = TestBed.get(CopierService);
spyOn(snackBar, 'open');
spyOn(copierService, 'copyText').and.returnValue(false);
diff --git a/aio/src/app/embedded/code/code.component.ts b/aio/src/app/embedded/code/code.component.ts
index e530b2a016..d3e71c8cbf 100644
--- a/aio/src/app/embedded/code/code.component.ts
+++ b/aio/src/app/embedded/code/code.component.ts
@@ -2,7 +2,7 @@ import { Component, ElementRef, ViewChild, OnChanges, Input } from '@angular/cor
import { Logger } from 'app/shared/logger.service';
import { PrettyPrinter } from './pretty-printer.service';
import { CopierService } from 'app/shared/copier.service';
-import { MdSnackBar } from '@angular/material';
+import { MatSnackBar } from '@angular/material';
const defaultLineNumsCount = 10; // by default, show linenums over this number
@@ -100,7 +100,7 @@ export class CodeComponent implements OnChanges {
@ViewChild('codeContainer') codeContainer: ElementRef;
constructor(
- private snackbar: MdSnackBar,
+ private snackbar: MatSnackBar,
private pretty: PrettyPrinter,
private copier: CopierService,
private logger: Logger) {}
diff --git a/aio/src/app/embedded/contributor/contributor.component.ts b/aio/src/app/embedded/contributor/contributor.component.ts
index 2673c86edc..5b7ab69384 100644
--- a/aio/src/app/embedded/contributor/contributor.component.ts
+++ b/aio/src/app/embedded/contributor/contributor.component.ts
@@ -13,14 +13,14 @@ import { CONTENT_URL_PREFIX } from 'app/documents/document.service';
-
+
View Bio
-
-
diff --git a/aio/src/app/embedded/embedded.module.ts b/aio/src/app/embedded/embedded.module.ts
index b65d5bda58..ec30c3379a 100644
--- a/aio/src/app/embedded/embedded.module.ts
+++ b/aio/src/app/embedded/embedded.module.ts
@@ -9,7 +9,7 @@ import { PrettyPrinter } from './code/pretty-printer.service';
// It is not enough just to import them inside the AppModule
// Reusable components (used inside embedded components)
-import { MdIconModule, MdSnackBarModule, MdTabsModule } from '@angular/material';
+import { MatIconModule, MatSnackBarModule, MatTabsModule } from '@angular/material';
import { CodeComponent } from './code/code.component';
import { SharedModule } from 'app/shared/shared.module';
@@ -43,9 +43,9 @@ export class EmbeddedComponents {
@NgModule({
imports: [
CommonModule,
- MdIconModule,
- MdSnackBarModule,
- MdTabsModule,
+ MatIconModule,
+ MatSnackBarModule,
+ MatTabsModule,
SharedModule
],
declarations: [
diff --git a/aio/src/app/embedded/toc/toc.component.html b/aio/src/app/embedded/toc/toc.component.html
index 81c026a4f5..a634cfa118 100644
--- a/aio/src/app/embedded/toc/toc.component.html
+++ b/aio/src/app/embedded/toc/toc.component.html
@@ -10,7 +10,7 @@
aria-label="Expand/collapse contents"
[attr.aria-pressed]="!isCollapsed">
Contents
-
+
diff --git a/aio/src/app/layout/nav-item/nav-item.component.html b/aio/src/app/layout/nav-item/nav-item.component.html
index 799feab04f..5e76ec1e46 100644
--- a/aio/src/app/layout/nav-item/nav-item.component.html
+++ b/aio/src/app/layout/nav-item/nav-item.component.html
@@ -9,14 +9,14 @@
diff --git a/aio/src/app/shared/custom-md-icon-registry.spec.ts b/aio/src/app/shared/custom-md-icon-registry.spec.ts
index d7361d9ec6..92e35f8285 100644
--- a/aio/src/app/shared/custom-md-icon-registry.spec.ts
+++ b/aio/src/app/shared/custom-md-icon-registry.spec.ts
@@ -1,4 +1,4 @@
-import { MdIconRegistry } from '@angular/material';
+import { MatIconRegistry } from '@angular/material';
import { CustomMdIconRegistry, SvgIconInfo } from './custom-md-icon-registry';
describe('CustomMdIconRegistry', () => {
@@ -24,15 +24,15 @@ describe('CustomMdIconRegistry', () => {
const svgIcons: SvgIconInfo[] = [
{ name: 'test_icon', svgSource: svgSrc }
];
- spyOn(MdIconRegistry.prototype, 'getNamedSvgIcon');
+ spyOn(MatIconRegistry.prototype, 'getNamedSvgIcon');
const registry = new CustomMdIconRegistry(mockHttp, mockSanitizer, svgIcons);
registry.getNamedSvgIcon('other_icon');
- expect(MdIconRegistry.prototype.getNamedSvgIcon).toHaveBeenCalledWith('other_icon', undefined);
+ expect(MatIconRegistry.prototype.getNamedSvgIcon).toHaveBeenCalledWith('other_icon', undefined);
registry.getNamedSvgIcon('other_icon', 'foo');
- expect(MdIconRegistry.prototype.getNamedSvgIcon).toHaveBeenCalledWith('other_icon', 'foo');
+ expect(MatIconRegistry.prototype.getNamedSvgIcon).toHaveBeenCalledWith('other_icon', 'foo');
});
});
diff --git a/aio/src/app/shared/custom-md-icon-registry.ts b/aio/src/app/shared/custom-md-icon-registry.ts
index e2a901d464..4df6dd7cea 100644
--- a/aio/src/app/shared/custom-md-icon-registry.ts
+++ b/aio/src/app/shared/custom-md-icon-registry.ts
@@ -1,6 +1,6 @@
import { InjectionToken, Inject, Injectable } from '@angular/core';
import { of } from 'rxjs/observable/of';
-import { MdIconRegistry } from '@angular/material';
+import { MatIconRegistry } from '@angular/material';
import { HttpClient } from '@angular/common/http';
import { DomSanitizer } from '@angular/platform-browser';
@@ -45,7 +45,7 @@ function createFakeHttp(http: HttpClient): any {
* us to provide preloaded icon SVG sources.
*/
@Injectable()
-export class CustomMdIconRegistry extends MdIconRegistry {
+export class CustomMdIconRegistry extends MatIconRegistry {
private preloadedSvgElements: SvgIconMap = {};
constructor(http: HttpClient, sanitizer: DomSanitizer, @Inject(SVG_ICONS) svgIcons: SvgIconInfo[]) {
diff --git a/aio/src/app/shared/scroll.service.ts b/aio/src/app/shared/scroll.service.ts
index b6dba4dbed..b9343a68a2 100644
--- a/aio/src/app/shared/scroll.service.ts
+++ b/aio/src/app/shared/scroll.service.ts
@@ -17,7 +17,7 @@ export class ScrollService {
// at the top (e.g. toolbar) + some margin
get topOffset() {
if (!this._topOffset) {
- const toolbar = this.document.querySelector('md-toolbar.app-toolbar');
+ const toolbar = this.document.querySelector('mat-toolbar.app-toolbar');
this._topOffset = (toolbar && toolbar.clientHeight || 0) + topMargin;
}
return this._topOffset;
diff --git a/aio/src/styles/1-layouts/_marketing-layout.scss b/aio/src/styles/1-layouts/_marketing-layout.scss
index 120996b599..83d6671c94 100644
--- a/aio/src/styles/1-layouts/_marketing-layout.scss
+++ b/aio/src/styles/1-layouts/_marketing-layout.scss
@@ -311,7 +311,7 @@ aio-shell {
}
@media (max-width: 600px) {
- md-sidenav-container.sidenav-container {
+ mat-sidenav-container.sidenav-container {
padding-top: 0;
}
}
@@ -336,7 +336,7 @@ aio-shell {
}
aio-shell:not(.view-SideNav) {
- md-sidenav-container.sidenav-container {
+ mat-sidenav-container.sidenav-container {
max-width: none;
}
}
diff --git a/aio/src/styles/1-layouts/_sidenav.scss b/aio/src/styles/1-layouts/_sidenav.scss
index 278c4575d2..292a940c90 100644
--- a/aio/src/styles/1-layouts/_sidenav.scss
+++ b/aio/src/styles/1-layouts/_sidenav.scss
@@ -26,7 +26,7 @@ aio-nav-menu {
}
}
-md-sidenav.mat-sidenav.sidenav {
+mat-sidenav.mat-sidenav.sidenav {
position: fixed;
top: 64px;
bottom: 0;
@@ -42,7 +42,7 @@ md-sidenav.mat-sidenav.sidenav {
}
}
-md-sidenav-container.sidenav-container {
+mat-sidenav-container.sidenav-container {
min-height: 100%;
height: auto !important;
max-width: 100%;
@@ -54,7 +54,7 @@ md-sidenav-container.sidenav-container {
}
}
-md-sidenav-container div.mat-sidenav-content {
+mat-sidenav-container div.mat-sidenav-content {
height: auto;
}
@@ -176,7 +176,7 @@ aio-nav-menu.top-menu {
}
// Angular Version Selector
-md-sidenav .doc-version {
+mat-sidenav .doc-version {
padding: 8px;
border-top: 1px solid $lightgray;
diff --git a/aio/src/styles/1-layouts/_top-menu.scss b/aio/src/styles/1-layouts/_top-menu.scss
index c259d77a01..f45741fb85 100644
--- a/aio/src/styles/1-layouts/_top-menu.scss
+++ b/aio/src/styles/1-layouts/_top-menu.scss
@@ -57,7 +57,7 @@ aio-top-menu {
}
// HOME PAGE OVERRIDE: TOPNAV TOOLBAR HAMBURGER MENU
-aio-shell.page-home md-toolbar.app-toolbar.mat-toolbar {
+aio-shell.page-home mat-toolbar.app-toolbar.mat-toolbar {
background-color: transparent;
transition: background-color .2s linear .3s;
@@ -67,7 +67,7 @@ aio-shell.page-home md-toolbar.app-toolbar.mat-toolbar {
}
// DOCS PAGE / STANDARD: TOPNAV TOOLBAR FIXED
-md-toolbar.mat-toolbar {
+mat-toolbar.mat-toolbar {
position: fixed;
top: 0;
right: 0;
@@ -76,16 +76,16 @@ md-toolbar.mat-toolbar {
padding: 0 16px 0 0;
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.30);
- md-icon {
+ mat-icon {
color: $white;
}
}
// MARKETING PAGES OVERRIDE: TOPNAV TOOLBAR AND HAMBURGER
-aio-shell.page-home md-toolbar.mat-toolbar,
-aio-shell.page-features md-toolbar.mat-toolbar,
-aio-shell.page-events md-toolbar.mat-toolbar,
-aio-shell.page-resources md-toolbar.mat-toolbar {
+aio-shell.page-home mat-toolbar.mat-toolbar,
+aio-shell.page-features mat-toolbar.mat-toolbar,
+aio-shell.page-events mat-toolbar.mat-toolbar,
+aio-shell.page-resources mat-toolbar.mat-toolbar {
// FIXED TOPNAV TOOLBAR FOR SMALL MOBILE
@media (min-width: 481px) {
position: absolute;
@@ -99,9 +99,9 @@ aio-shell.page-resources md-toolbar.mat-toolbar {
}
// REMOVE BOX SHADOW ON CERTAIN MARKETING PAGES
-aio-shell.page-home md-toolbar.mat-toolbar,
-aio-shell.page-events md-toolbar.mat-toolbar,
-aio-shell.page-resources md-toolbar.mat-toolbar {
+aio-shell.page-home mat-toolbar.mat-toolbar,
+aio-shell.page-events mat-toolbar.mat-toolbar,
+aio-shell.page-resources mat-toolbar.mat-toolbar {
box-shadow: none;
}
diff --git a/aio/src/styles/2-modules/_buttons.scss b/aio/src/styles/2-modules/_buttons.scss
index fc3a8fd3fc..4ef6cd5be1 100644
--- a/aio/src/styles/2-modules/_buttons.scss
+++ b/aio/src/styles/2-modules/_buttons.scss
@@ -105,6 +105,6 @@ a.filter-button {
}
}
-[md-button], [md-raised-button], [mat-button], [mat-raised-button] {
+[mat-button], [mat-raised-button], [mat-button], [mat-raised-button] {
text-transform: uppercase;
}
\ No newline at end of file
diff --git a/aio/src/styles/2-modules/_code.scss b/aio/src/styles/2-modules/_code.scss
index 76a2b1ec3e..f98e53df6f 100644
--- a/aio/src/styles/2-modules/_code.scss
+++ b/aio/src/styles/2-modules/_code.scss
@@ -4,7 +4,7 @@ code-example, code-tabs {
}
code-example,
-code-tabs md-tab-body {
+code-tabs mat-tab-body {
&:not(.no-box) {
background-color: rgba($backgroundgray, 0.2);
border: 0.5px solid $lightgray;
@@ -49,8 +49,8 @@ code-example.avoidFile header {
code-example.avoid,
code-example.avoidFile,
-code-tabs.avoid md-tab-body,
-code-tabs.avoidFile md-tab-body {
+code-tabs.avoid mat-tab-body,
+code-tabs.avoidFile mat-tab-body {
border: 0.5px solid $anti-pattern;
}
@@ -58,7 +58,7 @@ code-tabs div .mat-tab-body-content {
height: auto;
}
-code-tabs .mat-tab-body-wrapper md-tab-body .mat-tab-body {
+code-tabs .mat-tab-body-wrapper mat-tab-body .mat-tab-body {
overflow-y: hidden;
}
diff --git a/aio/src/styles/2-modules/_contributor.scss b/aio/src/styles/2-modules/_contributor.scss
index da4542f8d7..aec293f8ca 100644
--- a/aio/src/styles/2-modules/_contributor.scss
+++ b/aio/src/styles/2-modules/_contributor.scss
@@ -69,7 +69,7 @@ aio-contributor {
opacity: 0;
border-radius: 50%;
- [md-button] {
+ [mat-button] {
color: $white;
font-size: 14px;
font-weight: 500;
diff --git a/aio/src/styles/2-modules/_scrollbar.scss b/aio/src/styles/2-modules/_scrollbar.scss
index 38549cc31f..6f9eddc09e 100644
--- a/aio/src/styles/2-modules/_scrollbar.scss
+++ b/aio/src/styles/2-modules/_scrollbar.scss
@@ -1,13 +1,13 @@
-body::-webkit-scrollbar, md-sidenav.sidenav::-webkit-scrollbar, .mat-sidenav-content::-webkit-scrollbar {
+body::-webkit-scrollbar, mat-sidenav.sidenav::-webkit-scrollbar, .mat-sidenav-content::-webkit-scrollbar {
height: 6px;
width: 6px;
}
-body::-webkit-scrollbar-track, md-sidenav.sidenav::-webkit-scrollbar-trac, .mat-sidenav-content::-webkit-scrollbar-trac {
+body::-webkit-scrollbar-track, mat-sidenav.sidenav::-webkit-scrollbar-trac, .mat-sidenav-content::-webkit-scrollbar-trac {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
-body::-webkit-scrollbar-thumb, md-sidenav.sidenav::-webkit-scrollbar-thumb, .mat-sidenav-content::-webkit-scrollbar-thumb {
+body::-webkit-scrollbar-thumb, mat-sidenav.sidenav::-webkit-scrollbar-thumb, .mat-sidenav-content::-webkit-scrollbar-thumb {
background-color: $mediumgray;
outline: 1px solid $darkgray;
}
diff --git a/aio/src/styles/2-modules/_toc.scss b/aio/src/styles/2-modules/_toc.scss
index c4a2f08b78..028f839b67 100644
--- a/aio/src/styles/2-modules/_toc.scss
+++ b/aio/src/styles/2-modules/_toc.scss
@@ -59,7 +59,7 @@ aio-toc {
}
button.toc-heading {
- md-icon.rotating-icon {
+ mat-icon.rotating-icon {
height: 18px;
width: 18px;
position: relative;
diff --git a/aio/yarn.lock b/aio/yarn.lock
index ac82cd59e2..290c1ec7bb 100644
--- a/aio/yarn.lock
+++ b/aio/yarn.lock
@@ -32,9 +32,9 @@
dependencies:
tslib "^1.7.1"
-"@angular/cdk@^2.0.0-beta.8":
- version "2.0.0-beta.8"
- resolved "https://registry.yarnpkg.com/@angular/cdk/-/cdk-2.0.0-beta.8.tgz#71961c851dfbeb19e085e898bf5e4461408f8b57"
+"@angular/cdk@2.0.0-beta.11":
+ version "2.0.0-beta.11"
+ resolved "https://registry.yarnpkg.com/@angular/cdk/-/cdk-2.0.0-beta.11.tgz#b9e799574786272c63b6334c837c5ee2445bc933"
dependencies:
tslib "^1.7.1"
@@ -140,9 +140,9 @@
dependencies:
tslib "^1.7.1"
-"@angular/material@^2.0.0-beta.8":
- version "2.0.0-beta.8"
- resolved "https://registry.yarnpkg.com/@angular/material/-/material-2.0.0-beta.8.tgz#a92852abc9261aea26c2401f576645470be2cf38"
+"@angular/material@2.0.0-beta.11":
+ version "2.0.0-beta.11"
+ resolved "https://registry.yarnpkg.com/@angular/material/-/material-2.0.0-beta.11.tgz#9124a1f50f3eb7dc28640317ee1e875f71da753a"
dependencies:
tslib "^1.7.1"