Move styles from sample.css to heroes.component.css, document changes to heroes.component.css in the tutorial.

Author: Adam-Meisen

public/docs/_examples/toh-6/ts/app/heroes.component.css

@@ -57,3 +57,10 @@ button {
 button:hover {
   background-color: #cfd8dc;
 }
+/* #docregion delete-hero */
+button.delete-button{
+  float:right;
+  background-color: gray !important;
+  color:white;
+}
+/* #enddocregion delete-hero */

public/docs/_examples/toh-6/ts/sample.css

@@ -315,7 +315,9 @@ block add-new-hero-via-detail-comp
   The user can *delete* an existing hero by clicking a delete button next to the hero's name.
   Add the following to the heroes component HTML right after the hero name in the repeated `<li>` tag:
 +makeExample('app/heroes.component.html', 'delete')
-
+:marked
+  Add the following CSS to the bottom of `heroes.component.css`.
++makeExample('toh-6/ts/app/heroes.component.css', 'delete-hero', 'app/heroes.component.css (delete)')(format=".")
 :marked
   Now let's fix-up the `HeroesComponent` to support the *add* and *delete* actions used in the template.
   Let's start with *add*.
@@ -390,7 +392,6 @@ block filetree
       .file typings ...
       .file index.html
       .file package.json
-      .file sample.css (new)
       .file styles.css
       .file systemjs.config.json
       .file tsconfig.json
@@ -414,6 +415,7 @@ block file-summary
     `toh-6/ts/app/app.component.ts,
      toh-6/ts/app/heroes.component.ts,
      toh-6/ts/app/heroes.component.html,
+     toh-6/ts/app/heroes.component.css,
      toh-6/ts/app/hero-detail.component.ts,
      toh-6/ts/app/hero-detail.component.html,
      toh-6/ts/app/hero.service.ts,