File tree Expand file tree Collapse file tree 2 files changed +5
-27
lines changed
docs/documentation/stories Expand file tree Collapse file tree 2 files changed +5
-27
lines changed Original file line number Diff line number Diff line change @@ -12,7 +12,7 @@ First install Bootstrap from `npm`:
12
12
``` bash
13
13
npm install jquery --save
14
14
npm install popper.js --save
15
- npm install bootstrap@next --save
15
+ npm install bootstrap --save
16
16
```
17
17
18
18
Then add the needed script files to ` apps[0].scripts ` :
Original file line number Diff line number Diff line change @@ -22,11 +22,7 @@ With the new project created and ready you will next need to install bootstrap t
22
22
Using the ` --save ` option the dependency will be saved in package.json
23
23
24
24
``` sh
25
- # version 3.x
26
25
npm install bootstrap --save
27
-
28
- # version 4.x
29
- npm install bootstrap@next --save
30
26
```
31
27
32
28
### Configuring Project
@@ -74,33 +70,19 @@ cd my-app
74
70
### Installing Bootstrap
75
71
76
72
``` sh
77
- # version 3.x
78
- npm install bootstrap-sass --save
79
-
80
- # version 4.x
81
- npm install bootstrap@next --save
73
+ npm install bootstrap --save
82
74
```
83
75
84
76
### Configuring Project
85
77
86
- Create an empty file ` _variables.scss ` in ` src/ ` .
87
-
88
- If you are using ` bootstrap-sass ` , add the following to ` _variables.scss ` :
89
-
90
- ``` sass
91
- $icon-font-path: '../node_modules/bootstrap-sass/assets/fonts/bootstrap/';
92
- ```
78
+ Create an empty file ` _variables.scss ` in ` src/ ` . The ` _variables.scss ` file allows us to customize Bootstrap by overriding Sass variables
79
+ used by Boostrap. For instance, you can add ` $primary: red; ` to use red as primary color.
93
80
94
81
In ` styles.scss ` add the following:
95
82
96
83
``` sass
97
- // version 3
98
84
@import 'variables';
99
- @import '../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap';
100
-
101
- // version 4
102
- @import 'variables';
103
- @import '../node_modules/bootstrap/scss/bootstrap';
85
+ @import '~bootstrap/scss/bootstrap';
104
86
```
105
87
106
88
### Testing Project
@@ -117,10 +99,6 @@ Verify the bootstrap styled button appears.
117
99
To ensure your variables are used open ` _variables.scss ` and add the following:
118
100
119
101
``` sass
120
- // version 3
121
- $brand-primary: red;
122
-
123
- // version 4
124
102
$primary: red;
125
103
```
126
104
You can’t perform that action at this time.
0 commit comments