From: Mark Otto Date: Sat, 25 Mar 2023 03:20:38 +0000 (-0500) Subject: Fix up docs X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=87edeeff138c7d729c1d2c632f66b9f9c787ddc3;p=thirdparty%2Fbootstrap.git Fix up docs --- diff --git a/site/content/docs/5.3/utilities/mixin.md b/site/content/docs/5.3/utilities/mixin.md index b4798b281e..88b05fb9c0 100644 --- a/site/content/docs/5.3/utilities/mixin.md +++ b/site/content/docs/5.3/utilities/mixin.md @@ -9,16 +9,25 @@ toc: true ## How it works -Bootstrap generates hundreds of utilities to quickly and easily style elements through the addition of classes in your HTML. Now with Bootstrap v5.3.0, you can add utilities in your custom Sass with the `util()` mixin. Using the [utility API]({{< docsref "/utilities/api" >}}), we generate placeholders for every utility that can be included via Sass mixin. Use the mixin in your own Sass files to include quick styles, override defaults, or compose entire components. +Bootstrap generates hundreds of utilities to quickly and easily style elements through the addition of classes in your HTML. Now with Bootstrap v5.3.0, you can add utilities in your custom Sass with the `util()` mixin. Using the [utility API]({{< docsref "/utilities/api" >}}), we generate placeholders for every utility that can then be included via Sass mixin. Use the mixin in your own Sass files to include quick styles, override defaults, or compose entire components. ```html - +
...
- +
...
``` +```scss +// Using the utility mixin in your custom Sass +.test { + @include util(d-inline-flex); + @include util(p-4); + @include util(mb-md-3); +} +``` + ## Motivation There are two major motivations for creating the utility mixin: @@ -94,8 +103,10 @@ Want to use only the utilities and mixin in your own project? In your project's // Required Bootstrap imports @import "bootstrap/scss/functions"; @import "bootstrap/scss/variables"; +@import "bootstrap/scss/variables-dark"; @import "bootstrap/scss/maps"; @import "bootstrap/scss/mixins"; +@import "bootstrap/scss/root"; // Import the utilities maps and mixins @import "bootstrap/scss/utilities";