From 204aac602e99cf94b85f63c6176aa8895d6c5e55 Mon Sep 17 00:00:00 2001
From: alexanderroese <github@roese.dev>
Date: Fri, 21 Jun 2024 08:19:05 +0200
Subject: [PATCH] dynamic navbar colors

---
 layout/theme.liquid | 40 ++++++++++++++++++++++++++--------------
 1 file changed, 26 insertions(+), 14 deletions(-)

diff --git a/layout/theme.liquid b/layout/theme.liquid
index 6856301..e24cd7a 100644
--- a/layout/theme.liquid
+++ b/layout/theme.liquid
@@ -53,7 +53,7 @@
     %}
 
     <script>
-      console.log("schemes15", "{{ settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["background"] }}")
+      console.log("schemes16", "{{ settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["background"] }}")
 
     </script>
 
@@ -70,20 +70,32 @@
           :root,
         {%- endif %}
         .color-{{ scheme.id }} {
-          --color-background: {{ scheme.settings.background.red }},{{ scheme.settings.background.green }},{{ scheme.settings.background.blue }};
           
-        {% liquid
+          {% liquid
           if scheme.id == "scheme-main-navbar" and (page.url == "/pages/texte" or product.tags contains "shx-texte")
             assign new_background = settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["background"]
+            assign new_background_gradient = settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["background_gradient"]
             assign new_text = settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["text"]
-          else
+            assign new_shadow = settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["shadow"]
+            assign new_button = settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["button"]
+            assign new_button_label = settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["button_label"]
+            assign new_secondary_button_label = settings.color_schemes["scheme-shx-texte-navbar"]["settings"]["secondary_button_label"]
+            else
             assign new_background = scheme.settings.background
+            assign new_background_gradient = scheme.settings.background_gradient
             assign new_text = scheme.settings.text
+            assign new_shadow = scheme.settings.shadow
+            assign new_button = scheme.settings.button
+            assign new_button_label = scheme.settings.button_label
+            assign new_secondary_button_label = scheme.settings.secondary_button_label
           endif
         %}
+
+
+        --color-background: {{ new_background.red }},{{ new_background.green }},{{ new_background.blue }};
         
-        {% if scheme.settings.background_gradient != empty %}
-          --gradient-background: {{ scheme.settings.background_gradient }};
+        {% if new_background_gradient != empty %}
+          --gradient-background: {{ new_background_gradient }};
         {% else %}
           --gradient-background: {{ new_background }};
         {% endif %}
@@ -102,16 +114,16 @@
 
         --color-foreground: {{ new_text.red }},{{ new_text.green }},{{ new_text.blue }};
         --color-background-contrast: {{ background_color_contrast.red }},{{ background_color_contrast.green }},{{ background_color_contrast.blue }};
-        --color-shadow: {{ scheme.settings.shadow.red }},{{ scheme.settings.shadow.green }},{{ scheme.settings.shadow.blue }};
-        --color-button: {{ scheme.settings.button.red }},{{ scheme.settings.button.green }},{{ scheme.settings.button.blue }};
-        --color-button-text: {{ scheme.settings.button_label.red }},{{ scheme.settings.button_label.green }},{{ scheme.settings.button_label.blue }};
-        --color-secondary-button: {{ scheme.settings.background.red }},{{ scheme.settings.background.green }},{{ scheme.settings.background.blue }};
-        --color-secondary-button-text: {{ scheme.settings.secondary_button_label.red }},{{ scheme.settings.secondary_button_label.green }},{{ scheme.settings.secondary_button_label.blue }};
-        --color-link: {{ scheme.settings.secondary_button_label.red }},{{ scheme.settings.secondary_button_label.green }},{{ scheme.settings.secondary_button_label.blue }};
+        --color-shadow: {{ new_shadow.red }},{{ new_shadow.green }},{{ new_shadow.blue }};
+        --color-button: {{ new_button.red }},{{ new_button.green }},{{ new_button.blue }};
+        --color-button-text: {{ new_button_label.red }},{{ new_button_label.green }},{{ new_button_label.blue }};
+        --color-secondary-button: {{ new_button_label.red }},{{ new_button_label.green }},{{ new_button_label.blue }};
+        --color-secondary-button-text: {{ new_secondary_button_label.red }},{{ new_secondary_button_label.green }},{{ new_secondary_button_label.blue }};
+        --color-link: {{ new_secondary_button_label.red }},{{ new_secondary_button_label.green }},{{ new_secondary_button_label.blue }};
         --color-badge-foreground: {{ new_text.red }},{{ new_text.green }},{{ new_text.blue }};
-        --color-badge-background: {{ scheme.settings.background.red }},{{ scheme.settings.background.green }},{{ scheme.settings.background.blue }};
+        --color-badge-background: {{ new_button_label.red }},{{ new_button_label.green }},{{ new_button_label.blue }};
         --color-badge-border: {{ new_text.red }},{{ new_text.green }},{{ new_text.blue }};
-        --payment-terms-background-color: rgb({{ scheme.settings.background.rgb }});
+        --payment-terms-background-color: rgb({{ new_button_label.rgb }});
 
         {% comment %}