From 30669d427627999d1b3817ced7a87c5a34e0ca96 Mon Sep 17 00:00:00 2001
From: Marta Wierzbicka <martussky@MacBook-Pro-Marta.local>
Date: Wed, 12 Apr 2023 23:19:35 +0200
Subject: [PATCH] Fix hover effects color

---
 demo/sites/components/hover-effects.html                    | 3 +--
 .../docs/standard/content-styles/hover-effects/index.html   | 6 ++----
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/demo/sites/components/hover-effects.html b/demo/sites/components/hover-effects.html
index 5efa5b23d..5a7da5449 100644
--- a/demo/sites/components/hover-effects.html
+++ b/demo/sites/components/hover-effects.html
@@ -54,8 +54,7 @@
           alt="Louvre" />
         <a href="#!">
           <div
-            class="absolute top-0 right-0 bottom-0 left-0 h-full w-full overflow-hidden bg-fixed opacity-0 transition duration-300 ease-in-out hover:opacity-100"
-            style="background-color: rgba(251, 251, 251, 0.2)"></div>
+            class="absolute top-0 right-0 bottom-0 left-0 h-full w-full overflow-hidden bg-[hsl(0,0%,98.4%,0.2)] bg-fixed opacity-0 transition duration-300 ease-in-out hover:opacity-100"></div>
         </a>
       </div>
 
diff --git a/site/content/docs/standard/content-styles/hover-effects/index.html b/site/content/docs/standard/content-styles/hover-effects/index.html
index 28727348f..c1b561af9 100644
--- a/site/content/docs/standard/content-styles/hover-effects/index.html
+++ b/site/content/docs/standard/content-styles/hover-effects/index.html
@@ -43,8 +43,7 @@
         alt="Louvre" />
       <a href="#!">
         <div
-          class="absolute bottom-0 left-0 right-0 top-0 h-full w-full overflow-hidden bg-fixed opacity-0 transition duration-300 ease-in-out hover:opacity-100"
-          style="background-color: rgba(251, 251, 251, 0.2)"></div>
+          class="absolute bottom-0 left-0 right-0 top-0 h-full w-full overflow-hidden bg-[hsl(0,0%,98.4%,0.2)] bg-fixed opacity-0 transition duration-300 ease-in-out hover:opacity-100"></div>
       </a>
     </div>
   </div>
@@ -65,8 +64,7 @@
           alt="Louvre" />
         <a href="#!">
           <div
-            class="absolute bottom-0 left-0 right-0 top-0 h-full w-full overflow-hidden bg-fixed opacity-0 transition duration-300 ease-in-out hover:opacity-100"
-            style="background-color: rgba(251, 251, 251, 0.2)"></div>
+            class="absolute bottom-0 left-0 right-0 top-0 h-full w-full overflow-hidden bg-[hsl(0,0%,98.4%,0.2)] bg-fixed opacity-0 transition duration-300 ease-in-out hover:opacity-100"></div>
         </a>
       </div>
       {{< /twsnippet/code >}}