chore(docs): update bootstrap documentation

Close #4115

Author: delasteve

docs/documentation/stories/include-bootstrap.md

@@ -3,65 +3,119 @@
 [Bootstrap](http://getbootstrap.com/) is a popular CSS framework which can be used within an Angular project.
 This guide will walk you through adding bootstrap to your Angular CLI project and configuring it to use bootstrap.
 
+## Using CSS
+
+### Getting Started
+
 Create a new project and navigate into the project
+
 ```
 ng new my-app
 cd my-app
 ```
 
+### Installing Bootstrap
+
 With the new project created and ready you will next need to install bootstrap to your project as a dependency.
 Using the `--save` option the dependency will be saved in package.json
-```
-// version 3.x
+
+```sh
+# version 3.x
 npm install bootstrap --save
 
-// version 4.x
+# version 4.x
 npm install bootstrap@next --save
 ```
 
+### Configuring Project
+
 Now that the project is set up it must be configured to include the bootstrap CSS.
 
-Open the file `angular-cli.json` from the root of your project.
-Under the property `apps` the first item in that array is the default application.
-There is a property `styles` which allows external global styles to be applied to your application.
-Specify the path to `bootstrap.min.css`
-```
-// version 3.x and 4.x
-"../node_modules/bootstrap/dist/css/bootstrap.min.css"
+- Open the file `angular-cli.json` from the root of your project.
+- Under the property `apps` the first item in that array is the default application.
+- There is a property `styles` which allows external global styles to be applied to your application.
+- Specify the path to `bootstrap.min.css`
+
+  It should look like the following when you are done:
+  ```json
+  "styles": [
+    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
+    "styles.css"
+  ],
+  ```
+
+**Note:** When you make changes to `angular-cli.json` you will need to re-start `ng serve` to pick up configuration changes.
+
+### Testing Project
+
+Open `app.component.html` and add the following markup:
+
+```html
+<button class="btn btn-primary">Test Button</button>
 ```
 
 With the application configured, run `ng serve` to run your application in develop mode.
 In your browser navigate to the application `localhost:4200`.
-Make a change to your application to ensure that the CSS library has been included.
-A quick test is to add the following markup to `app.component.html`
+Verify the bootstrap styled button appears.
+
+## Using SASS
+
+### Getting Started
+
+Create a new project and navigate into the project
+
 ```
-<button class="btn btn-primary">Test Button</button>
+ng new my-app --style=scss
+cd my-app
 ```
-After saving this file, return to the browser to see the bootstrap styled button.
 
-## Using SASS
-Open `angular-cli.json` change reference of `styles.css` to `styles.scss` and rename the file accordingly.
+### Installing Bootstrap
+
+```sh
+# version 3.x
+npm install bootstrap-sass --save
+
+# version 4.x
+npm install bootstrap@next --save
+```
+
+### Configuring Project
 
 Create an empty file `_variables.scss` in `src/`.
 
-In `styles.scss` add the following:
+If you are using `bootstrap-sass`, add the following to `_variables.scss`:
 
+```sass
+$icon-font-path: '../node_modules/bootstrap-sass/assets/fonts/bootstrap/';
 ```
-@import '_variables';
+
+In `styles.scss` add the following:
+
+```sass
+// version 3
+@import 'variables';
+@import '../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap';
+
+// version 4
+@import 'variables';
 @import '../node_modules/bootstrap/scss/bootstrap';
 ```
 
-Open `app.component.html` and add the following markup
-```
+### Testing Project
+
+Open `app.component.html` and add the following markup:
+
+```html
 <button class="btn btn-primary">Test Button</button>
 ```
+
 With the application configured, run `ng serve` to run your application in develop mode.
 In your browser navigate to the application `localhost:4200`.
 Verify the bootstrap styled button appears.
 To ensure your variables are used open `_variables.scss` and add the following:
+
+```sass
+$brand-primary: red;
 ```
-$body-color: red;
-```
-Return the browser to see the font color changed.
 
-**Note:** When you make changes to `angular-cli.json` you will need to re-start `ng serve` to pick up configuration changes.
+Return the browser to see the font color changed.