From fd9c593910d3acc1335e6c66cd8fa4224873b76b Mon Sep 17 00:00:00 2001
From: "louismaxime.piton" <louismaxime.piton@orange.com>
Date: Fri, 10 Nov 2023 15:39:52 +0100
Subject: [PATCH 1/3] Add color mode on Grid example

---
 site/content/docs/5.3/examples/grid/grid.css   | 8 ++++----
 site/content/docs/5.3/examples/grid/index.html | 7 ++++---
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/site/content/docs/5.3/examples/grid/grid.css b/site/content/docs/5.3/examples/grid/grid.css
index 4550500a22..4f747afb13 100644
--- a/site/content/docs/5.3/examples/grid/grid.css
+++ b/site/content/docs/5.3/examples/grid/grid.css
@@ -1,14 +1,14 @@
 .themed-grid-col {
   padding-top: .75rem;
   padding-bottom: .75rem;
-  background-color: #eee; /* Boosted mod */
-  outline: 1px solid #ddd; /* Boosted mod */
+  background-color: var(--bs-secondary-bg); /* Boosted mod */
+  outline: 1px solid var(--bs-border-color-translucent); /* Boosted mod */
 }
 
 .themed-container {
   padding-top: .75rem; /* Boosted mod */
   padding-bottom: .75rem; /* Boosted mod */
   margin-bottom: 1.5rem;
-  background-color: #b5e8f7;
-  outline: 1px solid #4bb4e6; /* Boosted mod */
+  background-color: var(--bs-border-color-translucent); /* Boosted mod */
+  outline: 1px solid var(--bs-secondary); /* Boosted mod */
 }
diff --git a/site/content/docs/5.3/examples/grid/index.html b/site/content/docs/5.3/examples/grid/index.html
index 8270af8674..49748fc4c3 100644
--- a/site/content/docs/5.3/examples/grid/index.html
+++ b/site/content/docs/5.3/examples/grid/index.html
@@ -86,9 +86,10 @@ <h2 class="mt-4">Two columns</h2>
     </div>
 
     <h2 class="mt-4">Full width, single column</h2>
-    <p class="text-warning">
-      No grid classes are necessary for full-width elements.
-    </p>
+    <div class="alert alert-warning">
+      <span class="alert-icon"><span class="visually-hidden">Warning</span></span>
+      <p>No grid classes are necessary for full-width elements.</p>
+    </div>
 
     <hr class="my-4">
 

From 2eda99fdc536329ba5d32c96c0d3d8c9bb6b642d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20D=C3=A9ramond?= <julien.deramond@orange.com>
Date: Mon, 13 Nov 2023 15:38:25 +0100
Subject: [PATCH 2/3] Handle Boosted mods

---
 site/content/docs/5.3/examples/grid/grid.css | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/site/content/docs/5.3/examples/grid/grid.css b/site/content/docs/5.3/examples/grid/grid.css
index 4f747afb13..d74206d1c8 100644
--- a/site/content/docs/5.3/examples/grid/grid.css
+++ b/site/content/docs/5.3/examples/grid/grid.css
@@ -1,14 +1,17 @@
 .themed-grid-col {
   padding-top: .75rem;
   padding-bottom: .75rem;
-  background-color: var(--bs-secondary-bg); /* Boosted mod */
+  background-color: var(--bs-secondary-bg); /* Boosted mod: instead of `rgba(112.520718, 44.062154, 249.437846, .15)` */
+  /* Boosted mod: no `border` */
   outline: 1px solid var(--bs-border-color-translucent); /* Boosted mod */
 }
 
 .themed-container {
+  /* Boosted mod: no `padding` */
   padding-top: .75rem; /* Boosted mod */
   padding-bottom: .75rem; /* Boosted mod */
   margin-bottom: 1.5rem;
-  background-color: var(--bs-border-color-translucent); /* Boosted mod */
+  background-color: var(--bs-border-color-translucent); /* Boosted mod: instead of `rgba(112.520718, 44.062154, 249.437846, .15)` */
+  /* Boosted mod: no `border` */
   outline: 1px solid var(--bs-secondary); /* Boosted mod */
 }

From 07af7dacde6c349f2b235509523644248e786cbb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20D=C3=A9ramond?= <julien.deramond@orange.com>
Date: Mon, 13 Nov 2023 15:44:55 +0100
Subject: [PATCH 3/3] Use same colors for both themed stuff

---
 site/content/docs/5.3/examples/grid/grid.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/site/content/docs/5.3/examples/grid/grid.css b/site/content/docs/5.3/examples/grid/grid.css
index d74206d1c8..93793be2ef 100644
--- a/site/content/docs/5.3/examples/grid/grid.css
+++ b/site/content/docs/5.3/examples/grid/grid.css
@@ -11,7 +11,7 @@
   padding-top: .75rem; /* Boosted mod */
   padding-bottom: .75rem; /* Boosted mod */
   margin-bottom: 1.5rem;
-  background-color: var(--bs-border-color-translucent); /* Boosted mod: instead of `rgba(112.520718, 44.062154, 249.437846, .15)` */
+  background-color: var(--bs-secondary-bg); /* Boosted mod: instead of `rgba(112.520718, 44.062154, 249.437846, .15)` */
   /* Boosted mod: no `border` */
-  outline: 1px solid var(--bs-secondary); /* Boosted mod */
+  outline: 1px solid var(--bs-border-color-translucent); /* Boosted mod */
 }