style(button): explicitly style docs buttons (#132)

Author: andrewseguin

src/app/pages/homepage/homepage.html

@@ -5,7 +5,7 @@ <h1>Angular Material</h1>
       <h2> Material Design components for Angular apps</h2>
     </div>
     <div class="docs-header-start">
-     <a md-raised-button routerLink="guide/getting-started">Get started</a>
+     <a md-raised-button class="docs-button" routerLink="guide/getting-started">Get started</a>
     </div>
   </div>
 </header>
@@ -51,7 +51,7 @@ <h2>Optimized for Angular</h2>
     </div>
   </div>
   <div class="docs-homepage-bottom-start">
-    <a md-raised-button routerLink="guide/getting-started">Get started</a>
+    <a md-raised-button class="docs-button" routerLink="guide/getting-started">Get started</a>
   </div>
 </div>
 

src/app/shared/navbar/navbar.html

@@ -1,14 +1,14 @@
 <!-- TODO: figure out if the <nav> should go inside of a <header> element. -->
 <nav class="docs-navbar">
-  <a md-button routerLink="/" aria-label="Angular Material">
+  <a md-button class="docs-button" routerLink="/" aria-label="Angular Material">
     <img class="docs-angular-logo"
          src="../../../assets/img/homepage/angular-white-transparent.svg"
          alt="Angular">
     <span>Material</span>
   </a>
-  <a md-button routerLink="components">Components</a>
-  <a md-button routerLink="guides">Guides</a>
-  <a md-button href="https://github.com/angular/material2" aria-label="GitHub Repository">
+  <a md-button class="docs-button" routerLink="components">Components</a>
+  <a md-button class="docs-button" routerLink="guides">Guides</a>
+  <a md-button class="docs-button" href="https://github.com/angular/material2" aria-label="GitHub Repository">
     <img class="docs-github-logo"
          src="../../../assets/img/homepage/github-circle-white-transparent.svg"
          alt="GitHub">

src/main.scss

@@ -21,7 +21,7 @@ body {
   margin: 0;
 }
 
-[md-button], [md-raised-button] {
+.docs-button[md-button], .docs-button[md-raised-button] {
   text-transform: uppercase;
 }