File tree 1 file changed +24
-0
lines changed
docs/documentation/stories
1 file changed +24
-0
lines changed Original file line number Diff line number Diff line change @@ -39,5 +39,29 @@ A quick test is to add the following markup to `app.component.html`
39
39
```
40
40
After saving this file, return to the browser to see the bootstrap styled button.
41
41
42
+ ## Using SASS
43
+ Open ` angular-cli.json ` change reference of ` styles.css ` to ` styles.scss ` and rename the file accordingly.
44
+
45
+ Create an empty file ` _variables.scss ` in ` src/ ` .
46
+
47
+ In ` styles.scss ` add the following:
48
+
49
+ ```
50
+ @import '_variables';
51
+ @import '../node_modules/bootstrap/scss/bootstrap';
52
+ ```
53
+
54
+ Open ` app.component.html ` and add the following markup
55
+ ```
56
+ <button class="btn btn-primary">Test Button</button>
57
+ ```
58
+ With the application configured, run ` ng serve ` to run your application in develop mode.
59
+ In your browser navigate to the application ` localhost:4200 ` .
60
+ Verify the bootstrap styled button appears.
61
+ To ensure your variables are used open ` _variables.scss ` and add the following:
62
+ ```
63
+ $body-color: red;
64
+ ```
65
+ Return the browser to see the font color changed.
42
66
43
67
** Note:** When you make changes to ` angular-cli.json ` you will need to re-start ` ng serve ` to pick up configuration changes.
You can’t perform that action at this time.
0 commit comments