Update the custom Sass import docs (#34573)

Now includes mentino of the two utilities stylesheets, plus how and why to include the API stylesheet last

Fixes #34397

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
Mark Otto 2021-07-26 10:41:43 -05:00 committed by GitHub
parent e805a5e287
commit 905db7dadb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 2 deletions

View File

@ -61,15 +61,20 @@ In your `custom.scss`, you'll import Bootstrap's source Sass files. You have two
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/mixins";
// 4. Include any optional Bootstrap components as you like
// 4. Include any optional Bootstrap CSS as needed
@import "../node_modules/bootstrap/utilities";
@import "../node_modules/bootstrap/scss/root";
@import "../node_modules/bootstrap/scss/reboot";
@import "../node_modules/bootstrap/scss/type";
@import "../node_modules/bootstrap/scss/images";
@import "../node_modules/bootstrap/scss/containers";
@import "../node_modules/bootstrap/scss/grid";
@import "../node_modules/bootstrap/helpers";
// 5. Add additional custom code here
// 5. Optionally include utilities API last to generate classes based on the Sass map in `_utililies.scss`
@import "../node_modules/bootstrap/utilities/api";
// 6. Add additional custom code here
```
With that setup in place, you can begin to modify any of the Sass variables and maps in your `custom.scss`. You can also start to add parts of Bootstrap under the `// Optional` section as needed. We suggest using the full import stack from our `bootstrap.scss` file as your starting point.