From 57d80fcd3274ba1ff0a1580966e098fda80f74e7 Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Tue, 5 Oct 2021 09:46:33 -0700
Subject: [PATCH] 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>
---
 scss/_containers.scss                      | 2 +-
 scss/_variables.scss                       | 1 +
 site/content/docs/5.1/customize/options.md | 1 +
 site/content/docs/5.1/migration.md         | 4 ++++
 4 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/scss/_containers.scss b/scss/_containers.scss
index f88f1e5f5e..83b31381bf 100644
--- 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 f33b804a17..79c1498f6b 100644
--- 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 c819e6e84a..99aa258db9 100644
--- 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 8ebb13b813..10d4a44212 100644
--- 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.