Separate container classes from `$enable-grid-classes` option (#35005)

* Separate container classes from enable-grid-classes optoin

* Document the new option

* Mention in migration guide

Co-authored-by: XhmikosR <xhmikosr@gmail.com>

diff --git a/scss/_containers.scss b/scss/_containers.scss
index f88f1e5f5e953950d6b7ec35e32e2ec28611677c..83b31381bf890707a29db97319c554d90b023c32 100644 (file)
--- a/scss/_containers.scss
+++ b/scss/_containers.scss
@@ -2,7 +2,7 @@
 //
 // Set the container width, and override it for fixed navbars in media queries.
 
-@if $enable-grid-classes {
+@if $enable-container-classes {
   // Single container class with breakpoint max-widths
   .container,
   // 100% wide container at all breakpoints

diff --git a/scss/_variables.scss b/scss/_variables.scss
index f33b804a173b6296c4b690b0cea2bf36ad5c9bd4..79c1498f6bf361f6e2e09dd5556488576d4bf645 100644 (file)
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -345,6 +345,7 @@ $enable-transitions:          true !default;
 $enable-reduced-motion:       true !default;
 $enable-smooth-scroll:        true !default;
 $enable-grid-classes:         true !default;
+$enable-container-classes:    true !default;
 $enable-cssgrid:              false !default;
 $enable-button-pointers:      true !default;
 $enable-rfs:                  true !default;

diff --git a/site/content/docs/5.1/customize/options.md b/site/content/docs/5.1/customize/options.md
index c819e6e84a666010b628b8d0ddd0bfc3bf9c5190..99aa258db91120bee413999eeca7bdeebaaf256c 100644 (file)
--- a/site/content/docs/5.1/customize/options.md
+++ b/site/content/docs/5.1/customize/options.md
@@ -19,6 +19,7 @@ You can find and customize these variables for key global options in Bootstrap's
 | `$enable-transitions`          | `true` (default) or `false`        | Enables predefined `transition`s on various components. |
 | `$enable-reduced-motion`       | `true` (default) or `false`        | Enables the [`prefers-reduced-motion` media query]({{< docsref "/getting-started/accessibility#reduced-motion" >}}), which suppresses certain animations/transitions based on the users' browser/operating system preferences. |
 | `$enable-grid-classes`         | `true` (default) or `false`        | Enables the generation of CSS classes for the grid system (e.g. `.row`, `.col-md-1`, etc.). |
+| `$enable-container-classes`    | `true` (default) or `false`        | Enables the generation of CSS classes for layout containers. (New in v5.2.0) |
 | `$enable-caret`                | `true` (default) or `false`        | Enables pseudo element caret on `.dropdown-toggle`. |
 | `$enable-button-pointers`      | `true` (default) or `false`        | Add "hand" cursor to non-disabled button elements. |
 | `$enable-rfs`                  | `true` (default) or `false`        | Globally enables [RFS]({{< docsref "/getting-started/rfs" >}}). |

diff --git a/site/content/docs/5.1/migration.md b/site/content/docs/5.1/migration.md
index 8ebb13b813323480eaf9f000c450dd350b8be08c..10d4a44212160b0ea022c78a8e9a5e38b7701380 100644 (file)
--- a/site/content/docs/5.1/migration.md
+++ b/site/content/docs/5.1/migration.md
@@ -7,6 +7,10 @@ aliases: "/migration/"
 toc: true
 ---
 
+## v5.2.0
+
+- **Introduced new `$enable-container-classes` option.** Now when opting into the experimental CSS Grid layout, `.container-*` classes will still be compiled, unless this option is set to `false`.
+
 ## Dependencies
 
 - Dropped jQuery.