docs(button): add stroked buttons to examples (#11433)

Author: crisbeto

src/lib/button/button.md

@@ -38,5 +38,5 @@ default. The `<button>` element should be used for any interaction that _perform
 current page_. The `<a>` element should be used for any interaction that _navigates to another
 view_.
 
-Buttons or links containing only icons (such as `mat-fab`, `mat-mini-fab`, and `mat-icon-button`) should
-be given a meaningful label via `aria-label` or `aria-labelledby`.
+Buttons or links containing only icons (such as `mat-fab`, `mat-mini-fab`, and `mat-icon-button`)
+should be given a meaningful label via `aria-label` or `aria-labelledby`.

src/material-examples/button-types/button-types-example.css

@@ -3,3 +3,8 @@
   align-items: center;
   justify-content: space-around;
 }
+
+.example-button-row button,
+.example-button-row a {
+  margin-right: 8px;
+}

src/material-examples/button-types/button-types-example.html

@@ -18,6 +18,16 @@ <h3>Raised Buttons</h3>
   <a mat-raised-button routerLink=".">Link</a>
 </div>
 
+<h3>Stroked Buttons</h3>
+<div class="button-row">
+  <button mat-stroked-button>Basic</button>
+  <button mat-stroked-button color="primary">Primary</button>
+  <button mat-stroked-button color="accent">Accent</button>
+  <button mat-stroked-button color="warn">Warn</button>
+  <button mat-stroked-button disabled>Disabled</button>
+  <a mat-stroked-button routerLink=".">Link</a>
+</div>
+
 <h3>Icon Buttons</h3>
 <div class="button-row">
   <button mat-icon-button>