From bce7e21564431685438cc81a527cfbd81780efbe Mon Sep 17 00:00:00 2001
From: "Chrysanthe (chgo)" <chgo@odoo.com>
Date: Sun, 22 Sep 2024 17:38:16 +0200
Subject: [PATCH] [FIX] theme_*: fix `s_big_number` wrong gradient
 implementation

*: anelusia, artists, avantgarde, aviato, beauty, bewise, monglia,
vehicle

This commit aims to fix a wrong implementation of gradients on the
`s_big_number` snippet within the context of the web editor.

Prior to this commit, the `s_big_number` snippet was using a gradient
composed of the right color, but being declared as `RGB` values.

While this is working as expected and looking like it uses the right
`--o-color-*`, it's indeed working with the specific color applied in
first place. If a user changes the color palette of the website, the
snippet will look terrible as it doesn't adapt to the new palette.

This commit fixes the issue by using the right implementation with CSS
variables.

task-4202371
---
 theme_anelusia/views/snippets/s_big_number.xml | 2 +-
 theme_artists/views/snippets/s_big_number.xml  | 2 +-
 theme_avantgarde/views/customizations.xml      | 2 +-
 theme_aviato/views/snippets/s_big_number.xml   | 2 +-
 theme_beauty/views/snippets/s_big_number.xml   | 2 +-
 theme_bewise/views/customizations.xml          | 2 +-
 theme_monglia/views/customizations.xml         | 2 +-
 theme_vehicle/views/customizations.xml         | 2 +-
 8 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/theme_anelusia/views/snippets/s_big_number.xml b/theme_anelusia/views/snippets/s_big_number.xml
index 4fd3a4f50f..a6de02147c 100644
--- a/theme_anelusia/views/snippets/s_big_number.xml
+++ b/theme_anelusia/views/snippets/s_big_number.xml
@@ -14,7 +14,7 @@
 
     <!-- Text -->
     <xpath expr="//h2/div" position="replace" mode="inner">
-        <font class="text-gradient" style="background-image: linear-gradient(0deg, rgb(29, 32, 48) 25%, rgb(222, 222, 222) 80%);">
+        <font class="text-gradient" style="background-image: linear-gradient(0deg, var(--o-color-4) 25%, var(--o-color-5) 90%);">
             100+
         </font>
     </xpath>
diff --git a/theme_artists/views/snippets/s_big_number.xml b/theme_artists/views/snippets/s_big_number.xml
index c473da6f05..b2d79a4b00 100644
--- a/theme_artists/views/snippets/s_big_number.xml
+++ b/theme_artists/views/snippets/s_big_number.xml
@@ -17,7 +17,7 @@
         <attribute name="style" add="font-size: 7.75rem;" remove="font-size: 10.75rem;" separator=";"/>
     </xpath>
     <xpath expr="//h2/div" position="replace" mode="inner">
-        <font class="text-gradient" style="background-image: linear-gradient(0deg, rgb(165, 78, 223) 8%, rgb(222, 222, 222) 80%);">
+        <font class="text-gradient" style="background-image: linear-gradient(0deg, var(--o-color-1) 25%, var(--o-color-4) 90%);">
             250+
         </font>
     </xpath>
diff --git a/theme_avantgarde/views/customizations.xml b/theme_avantgarde/views/customizations.xml
index 7ef63a644f..58457ebbdc 100644
--- a/theme_avantgarde/views/customizations.xml
+++ b/theme_avantgarde/views/customizations.xml
@@ -556,7 +556,7 @@
 
     <!-- Text -->
     <xpath expr="//h2/div" position="replace" mode="inner">
-        <font class="text-gradient" style="background-image: linear-gradient(0deg, rgb(56, 60, 214) 0%, rgb(255, 255, 255) 65%);">
+        <font class="text-gradient" style="background-image: linear-gradient(0deg, var(--o-color-1) 0%, var(--o-color-4) 90%);">
             50+
         </font>
     </xpath>
diff --git a/theme_aviato/views/snippets/s_big_number.xml b/theme_aviato/views/snippets/s_big_number.xml
index ece1499699..1b9613a943 100644
--- a/theme_aviato/views/snippets/s_big_number.xml
+++ b/theme_aviato/views/snippets/s_big_number.xml
@@ -18,7 +18,7 @@
         <attribute name="style" add="font-size: 7.75rem;" remove="font-size: 10.75rem;" separator=";"/>
     </xpath>
     <xpath expr="//h2/div" position="replace" mode="inner">
-        <font class="text-gradient" style="background-image: linear-gradient(0deg, rgb(244, 168, 26) 0%, rgb(222, 222, 222) 58%);">100+</font>
+        <font class="text-gradient" style="background-image: linear-gradient(0deg, var(--o-color-1) 0%, var(--o-color-4) 90%);">100+</font>
     </xpath>
     <xpath expr="//h2/following-sibling::div" position="replace" mode="inner">
         destinations available
diff --git a/theme_beauty/views/snippets/s_big_number.xml b/theme_beauty/views/snippets/s_big_number.xml
index 4b1246c774..295eb95c44 100644
--- a/theme_beauty/views/snippets/s_big_number.xml
+++ b/theme_beauty/views/snippets/s_big_number.xml
@@ -18,7 +18,7 @@
         <attribute name="style" add="font-size: 7.75rem;" remove="font-size: 10.75rem;" separator=";"/>
     </xpath>
     <xpath expr="//h2/div" position="replace" mode="inner">
-        <font style="color: rgb(165, 35, 91);">200+</font>
+        <font style="color: var(--o-color-1)">200+</font>
     </xpath>
     <xpath expr="//h2/following-sibling::div" position="replace" mode="inner">
         happy customers
diff --git a/theme_bewise/views/customizations.xml b/theme_bewise/views/customizations.xml
index 161683f8b3..9f3a43ff4f 100644
--- a/theme_bewise/views/customizations.xml
+++ b/theme_bewise/views/customizations.xml
@@ -878,7 +878,7 @@
 
     <!-- Text -->
     <xpath expr="//h2/div" position="replace" mode="inner">
-        <font class="text-gradient" style="background-image: linear-gradient(0deg, rgb(29, 32, 48) 0%, rgb(222, 222, 222) 56%);">60+</font>
+        <font class="text-gradient" style="background-image: linear-gradient(0deg, var(--o-color-1) 0%, var(--o-color-4) 90%);">60+</font>
     </xpath>
     <xpath expr="//h2/following-sibling::div" position="replace" mode="inner">
         academic programs available
diff --git a/theme_monglia/views/customizations.xml b/theme_monglia/views/customizations.xml
index 6930efb86d..4ecbe4a534 100644
--- a/theme_monglia/views/customizations.xml
+++ b/theme_monglia/views/customizations.xml
@@ -649,7 +649,7 @@
         <attribute name="style" add="font-size: 7.75rem;" remove="font-size: 10.75rem;" separator=";"/>
     </xpath>
     <xpath expr="//h2/div" position="replace" mode="inner">
-        <font class="text-gradient" style="background-image: linear-gradient(0deg, rgb(237, 7, 104) 0%, rgb(222, 222, 222) 59%);">
+        <font class="text-gradient" style="background-image: linear-gradient(0deg, var(--o-color-1) 0%, var(--o-color-4) 75%);">
             250+
         </font>
     </xpath>
diff --git a/theme_vehicle/views/customizations.xml b/theme_vehicle/views/customizations.xml
index 69a1bab4be..5887535627 100644
--- a/theme_vehicle/views/customizations.xml
+++ b/theme_vehicle/views/customizations.xml
@@ -724,7 +724,7 @@
 
     <!-- Text -->
     <xpath expr="//h2/div" position="replace" mode="inner">
-        <font class="text-gradient" style="background-image: linear-gradient(0deg, rgb(29, 32, 48) 0%, rgb(222, 222, 222) 49%);">
+        <font class="text-gradient" style="background-image: linear-gradient(0deg, var(--o-color-5) 0%, var(--o-color-4) 90%);">
             87%
         </font>
     </xpath>