From 1c9e57eecfbd613a7a3087f5ef98ecc80d34f130 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20D=C3=A9ramond?= <julien.deramond@orange.com>
Date: Wed, 29 Nov 2023 07:12:20 +0100
Subject: [PATCH] Dark mode: move placeholders in /dark-mode

---
 site/content/docs/5.3/dark-mode.md | 374 ++++++++++++++---------------
 1 file changed, 187 insertions(+), 187 deletions(-)

diff --git a/site/content/docs/5.3/dark-mode.md b/site/content/docs/5.3/dark-mode.md
index 770e363339..fef7da9c69 100644
--- a/site/content/docs/5.3/dark-mode.md
+++ b/site/content/docs/5.3/dark-mode.md
@@ -4789,6 +4789,193 @@ sitemap_exclude: true
   </nav>
 </div>
 
+### Placeholders
+
+<h4 class="mt-3">No theme</h4>
+
+<div class="d-flex flex-column gap-2 border p-3">
+  <span class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
+</div>
+
+<h4 class="mt-3">Dark theme on container</h4>
+
+<div class="d-flex flex-column gap-2 border p-3 bg-body" data-bs-theme="dark">
+  <span class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
+</div>
+
+<h4 class="mt-3">Light theme on container</h4>
+
+<div class="d-flex flex-column gap-2 border p-3 bg-body" data-bs-theme="light">
+  <span class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
+  <span class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
+  <span class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
+</div>
+
+<h4 class="mt-3">Dark theme on component</h4>
+
+<div class="d-flex flex-column gap-2 border p-3" style="background-color: #282d55;">
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
+  <span data-bs-theme="dark" class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
+</div>
+
+<h4 class="mt-3">Light theme on component</h4>
+
+<div class="d-flex flex-column gap-2 border p-3" style="background-color: #b5e8f7">
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
+  <span data-bs-theme="light" class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
+</div>
+
 ### Popovers
 
 <h4 class="mt-3">No theme</h4>
@@ -9360,190 +9547,3 @@ sitemap_exclude: true
 <div class="d-flex gap-2 flex-wrap border p-3" style="background-color: #b5e8f7">
   <a class="link-chevron" href="#" data-bs-theme="light">This is a sample link with chevron</a>
 </div>
-
-### Placeholders
-
-<h4 class="mt-3">No theme</h4>
-
-<div class="d-flex flex-column gap-2 border p-3">
-  <span class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
-</div>
-
-<h4 class="mt-3">Dark theme on container</h4>
-
-<div class="d-flex flex-column gap-2 border p-3 bg-body" data-bs-theme="dark">
-  <span class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
-</div>
-
-<h4 class="mt-3">Light theme on container</h4>
-
-<div class="d-flex flex-column gap-2 border p-3 bg-body" data-bs-theme="light">
-  <span class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
-  <span class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
-  <span class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
-</div>
-
-<h4 class="mt-3">Dark theme on component</h4>
-
-<div class="d-flex flex-column gap-2 border p-3" style="background-color: #282d55;">
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
-  <span data-bs-theme="dark" class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
-</div>
-
-<h4 class="mt-3">Light theme on component</h4>
-
-<div class="d-flex flex-column gap-2 border p-3" style="background-color: #b5e8f7">
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-primary placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-primary placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-secondary placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-secondary placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-dark placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-dark placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-success placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-success placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-info placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-info placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-warning placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-warning placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-danger placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-bg-danger placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-green placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-green placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-purple placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-purple placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-yellow placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-yellow placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-blue placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-blue placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-pink placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-pink placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-orange placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-supporting-orange placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-light placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-light placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-white placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-black bg-white placeholder-glow">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-body bg-body placeholder-wave">Text</span>
-  <span data-bs-theme="light" class="placeholder col-12 text-body bg-body placeholder-glow">Text</span>
-</div>