diff options
| author | Mark Otto <[email protected]> | 2021-01-05 12:11:56 -0800 |
|---|---|---|
| committer | GitHub <[email protected]> | 2021-01-05 22:11:56 +0200 |
| commit | dfe1b156d1f5174ea005970e47fbf6eb66fba2f7 (patch) | |
| tree | 34ed9e153e549b463f25ad8421308c483a8f6d53 | |
| parent | fd48a8732f8a5f2a04317ad0aded47cb8589e088 (diff) | |
| download | bootstrap-dfe1b156d1f5174ea005970e47fbf6eb66fba2f7.tar.xz bootstrap-dfe1b156d1f5174ea005970e47fbf6eb66fba2f7.zip | |
Fixes #32557: Add functions and variables to the utilities API docs imports (#32684)
Co-authored-by: XhmikosR <[email protected]>
| -rw-r--r-- | site/content/docs/5.0/utilities/api.md | 8 |
1 files changed, 7 insertions, 1 deletions
diff --git a/site/content/docs/5.0/utilities/api.md b/site/content/docs/5.0/utilities/api.md index 135097f14..7cd002faf 100644 --- a/site/content/docs/5.0/utilities/api.md +++ b/site/content/docs/5.0/utilities/api.md @@ -244,9 +244,11 @@ Now that you're familiar with how the utilities API works, learn how to add your ### Add utilities -New utilities can be added to the default `$utilities` map with a `map-merge`. Make sure our `_utilities.scss` is imported first, then use the `map-merge` to add your additional utilities. For example, here's how to add a responsive `cursor` utility with three values. +New utilities can be added to the default `$utilities` map with a `map-merge`. Make sure our required Sass files and `_utilities.scss` are imported first, then use the `map-merge` to add your additional utilities. For example, here's how to add a responsive `cursor` utility with three values. ```scss +@import "bootstrap/scss/functions"; +@import "bootstrap/scss/variables"; @import "bootstrap/scss/utilities"; $utilities: map-merge( @@ -267,6 +269,8 @@ $utilities: map-merge( Modify existing utilities in the default `$utilities` map with `map-get` and `map-merge` functions. In the example below, we're adding an additional value to the `width` utilities. Start with an initial `map-merge` and then specify which utility you want to modify. From there, fetch the nested `"width"` map with `map-get` to access and modify the utility's options and values. ```scss +@import "bootstrap/scss/functions"; +@import "bootstrap/scss/variables"; @import "bootstrap/scss/utilities"; $utilities: map-merge( @@ -290,6 +294,8 @@ $utilities: map-merge( Remove any of the default utilities by setting the group key to `null`. For example, to remove all our `width` utilities, create a `$utilities` `map-merge` and add `"width": null` within. ```scss +@import "bootstrap/scss/functions"; +@import "bootstrap/scss/variables"; @import "bootstrap/scss/utilities"; $utilities: map-merge( |