From ab63ec1471964aaf8ffc3d65412b54b173fc5b9e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 19 Feb 2024 00:25:28 +0200
Subject: [PATCH] make dynamic directives have a type

---
 src/components/user_card/user_card.style.js     | 2 +-
 src/services/theme_data/theme_data_3.service.js | 8 +++++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/components/user_card/user_card.style.js b/src/components/user_card/user_card.style.js
index 1a8c179da4..a6190f5922 100644
--- a/src/components/user_card/user_card.style.js
+++ b/src/components/user_card/user_card.style.js
@@ -24,7 +24,7 @@ export default {
           color: '#000000',
           alpha: 0.6
         }],
-        '--profileTint': '$alpha(--background, 0.5)'
+        '--profileTint': 'color | $alpha(--background, 0.5)'
       }
     },
     {
diff --git a/src/services/theme_data/theme_data_3.service.js b/src/services/theme_data/theme_data_3.service.js
index d916f97d0c..a73d4cb5d4 100644
--- a/src/services/theme_data/theme_data_3.service.js
+++ b/src/services/theme_data/theme_data_3.service.js
@@ -661,7 +661,13 @@ export const init = (extraRuleset, palette) => {
             }
             default:
               if (k.startsWith('--')) {
-                return k + ': ' + rgba2css(findColor(v, computed[selector].dynamicVars))
+                const [type, value] = v.split('|').map(x => x.trim()) // woah, Extreme!
+                switch (type) {
+                  case 'color':
+                    return k + ': ' + rgba2css(findColor(value, computed[selector].dynamicVars))
+                  default:
+                    return ''
+                }
               }
               return ''
           }