chore(deps): Fix #115 breaking changes with @angular/material update (#116)

Author: krjordan

package.json

@@ -33,7 +33,7 @@
     "@angular/core": "^2.4.0",
     "@angular/forms": "^2.4.0",
     "@angular/http": "^2.4.0",
-    "@angular/material": "latest",
+    "@angular/material": "2.0.0-beta.2",
     "@angular/platform-browser": "^2.4.0",
     "@angular/platform-browser-dynamic": "^2.4.0",
     "@angular/router": "^3.4.0",

src/app/app.module.ts

@@ -34,7 +34,7 @@ import { schema } from './db';
   imports: [
     CommonModule,
     BrowserModule,
-    MaterialModule.forRoot(),
+    MaterialModule,
     ComponentsModule,
     RouterModule.forRoot(routes, { useHash: true }),
 

src/app/components/book-search.ts

@@ -10,7 +10,9 @@ import { Component, Output, Input, EventEmitter } from '@angular/core';
     <md-card>
       <md-card-title>Find a Book</md-card-title>
       <md-card-content>
-        <md-input placeholder="Search for a book" [value]="query" (keyup)="search.emit($event.target.value)"></md-input>
+        <md-input-container>
+          <input mdInput placeholder="Search for a book" [value]="query" (keyup)="search.emit($event.target.value)">
+        </md-input-container>
         <md-spinner [class.show]="searching"></md-spinner>
       </md-card-content>
     </md-card>
@@ -22,7 +24,7 @@ import { Component, Output, Input, EventEmitter } from '@angular/core';
       justify-content: center;
     }
 
-    md-input {
+    input {
       width: 300px;
     }
 

src/app/components/layout.ts

@@ -4,17 +4,17 @@ import { Component } from '@angular/core';
 @Component({
   selector: 'bc-layout',
   template: `
-    <md-sidenav-layout fullscreen>
-      
+    <md-sidenav-container fullscreen>
+
       <ng-content></ng-content>
 
-    </md-sidenav-layout>
+    </md-sidenav-container>
   `,
   styles: [`
-    md-sidenav-layout {
+    md-sidenav-container {
       background: rgba(0, 0, 0, 0.03);
     }
-    
+
     *, /deep/ * {
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;

yarn.lock

@@ -94,9 +94,9 @@
   version "2.4.7"
   resolved "https://registry.npmjs.org/@angular/http/-/http-2.4.7.tgz#b024b2b49ae0234258d42309e46f65862a42070d"
 
-"@angular/material@latest":
-  version "2.0.0-beta.1"
-  resolved "https://registry.npmjs.org/@angular/material/-/material-2.0.0-beta.1.tgz#106a0b79fb2b48a7606a0682c4e5d0bbe03364a0"
+"@angular/material@^2.0.0-beta.2":
+  version "2.0.0-beta.2"
+  resolved "https://registry.npmjs.org/@angular/material/-/material-2.0.0-beta.2.tgz#65ee8733990347b7518b7f42113e02e069dc109b"
 
 "@angular/platform-browser-dynamic@^2.4.0":
   version "2.4.7"