From 9b7ae98b57c3d465bfb1e2096a65d4ab11730ec5 Mon Sep 17 00:00:00 2001
From: "louismaxime.piton" <louismaxime.piton@orange.com>
Date: Wed, 1 Jun 2022 15:50:39 +0200
Subject: [PATCH 1/3] Couldn't spot any breaking change

---
 scss/_root.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/scss/_root.scss b/scss/_root.scss
index e0ee619067..c804dc41d1 100644
--- a/scss/_root.scss
+++ b/scss/_root.scss
@@ -79,7 +79,8 @@
 }
 
 // Boosted mod
-[class*="-dark"],
+.bg-black,
+[class*="-dark"]:not(.border-dark),
 .bg-secondary {
   --#{$prefix}link-color: #{$link-color-dark};
   --#{$prefix}link-hover-color: #{$link-hover-color-dark};

From b9a3f0374c56fd95776f27d57663dbbe8a97d56b Mon Sep 17 00:00:00 2001
From: "louismaxime.piton" <louismaxime.piton@orange.com>
Date: Fri, 8 Jul 2022 10:08:04 +0200
Subject: [PATCH 2/3] fix(review)

---
 scss/_root.scss | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/scss/_root.scss b/scss/_root.scss
index c804dc41d1..b5b7f6e10d 100644
--- a/scss/_root.scss
+++ b/scss/_root.scss
@@ -79,9 +79,9 @@
 }
 
 // Boosted mod
-.bg-black,
-[class*="-dark"]:not(.border-dark),
-.bg-secondary {
+[class*="bg-black"],
+[class*="-dark"]:not(.border-dark):not(.text-dark),
+[class*="bg-secondary"] {
   --#{$prefix}link-color: #{$link-color-dark};
   --#{$prefix}link-hover-color: #{$link-hover-color-dark};
   --#{$boosted-prefix}caption-color: #{$table-caption-color-dark};

From 5d795d613cba92d7c737d55caeb2e5afb8471473 Mon Sep 17 00:00:00 2001
From: "louismaxime.piton" <louismaxime.piton@orange.com>
Date: Wed, 12 Oct 2022 08:52:35 +0200
Subject: [PATCH 3/3] Proposal to document dark rule

---
 scss/_root.scss                                  | 2 ++
 site/content/docs/5.2/customize/css-variables.md | 8 ++++++++
 2 files changed, 10 insertions(+)

diff --git a/scss/_root.scss b/scss/_root.scss
index 1c378fa1a6..a48dec1391 100644
--- a/scss/_root.scss
+++ b/scss/_root.scss
@@ -79,6 +79,7 @@
   --#{$prefix}highlight-bg: #{$mark-bg};
 }
 
+// scss-docs-start root-dark-rule
 // Boosted mod
 [class*="bg-black"],
 [class*="-dark"]:not(.border-dark):not(.text-dark),
@@ -107,3 +108,4 @@
   }
 }
 // End mod
+// scss-docs-end root-dark-rule
diff --git a/site/content/docs/5.2/customize/css-variables.md b/site/content/docs/5.2/customize/css-variables.md
index 0408569a01..7e61f92599 100644
--- a/site/content/docs/5.2/customize/css-variables.md
+++ b/site/content/docs/5.2/customize/css-variables.md
@@ -36,6 +36,14 @@ Have a look at our table documentation for some [insight into how we're using CS
 
 Whenever possible, we'll assign CSS variables at the base component level (e.g., `.navbar` for navbar and its sub-components). This reduces guessing on where and how to customize, and allows for easy modifications by our team in future updates.
 
+### Dark text rule
+
+Using CSS variables allows a better flexibility on certain rules. This way we adapt our text variant color to our dark variants components instead of rewriting rules for each component. This process implies to override some existing CSS variables and to re-initialize those in some cases.
+
+Here is our proposal to handle the different text variants over the website:
+
+{{< scss-docs name="root-dark-rule" file="scss/_root.scss" >}}
+
 ## Prefix
 
 Most CSS variables use a prefix to avoid collisions with your own codebase. This prefix is in addition to the `--` that's required on every CSS variable.