From f7a5e34913c825c3cf9ab09b568a637968d5987d Mon Sep 17 00:00:00 2001
From: Chris Fulljames <christianfulljames@gmail.com>
Date: Thu, 6 Feb 2025 21:53:40 -0500
Subject: [PATCH] Fix color pickers not rendering in real time

---
 templates/profile.html | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/templates/profile.html b/templates/profile.html
index 8709499..f078ed5 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -7,13 +7,15 @@
 <link rel="stylesheet" href="/static/coloris.min.css"/>
 <script src="/static/coloris.min.js"></script>
 
-<style>
-:root {
-    {% if user_bgcolor %} --yellow: {{ user_bgcolor }} !important; {% endif %}
-    {% if user_fgcolor %} --black:  {{ user_fgcolor }} !important; {% endif %}
-    {% if user_accolor %} --purple: {{ user_accolor }} !important; {% endif %}
-}
-</style>
+<script>
+    // Apply user colors
+    document.addEventListener("DOMContentLoaded", (event) => {
+        var rootStyle = document.documentElement.style;
+        {% if user_bgcolor %} rootStyle.setProperty('--yellow', "{{ user_bgcolor }}"); {% endif %}
+        {% if user_fgcolor %} rootStyle.setProperty('--black', "{{ user_fgcolor }}"); {% endif %}
+        {% if user_accolor %} rootStyle.setProperty('--purple', "{{ user_accolor }}"); {% endif %}
+    });
+</script>
 
 {% endblock %}
 
-- 
2.39.5