Merge pull request #17 from georchestra/themable

New theming proposal
georchestra · Dec 22, 2023 · 9378cd2 · 9378cd2
2 parents 75d16b6 + b07fc4c
commit 9378cd2
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 13 deletions.
diff --git a/src/header.ce.vue b/src/header.ce.vue
@@ -72,6 +72,12 @@ onMounted(() => {
   </div>
   <header v-else class="host h-[80px] text-base" v-bind:style="props.style">
     <link rel="stylesheet" :href="props.stylesheet" v-if="props.stylesheet" />
+    <component :is="'style'" v-if="!props.stylesheet">
+      header { --georchestra-header-primary: #85127e;
+      --georchestra-header-secondary: #1b1f3b;
+      --georchestra-header-primary-light: #85127e1a;
+      --georchestra-header-secondary-light: #1b1f3b1a; }
+    </component>
     <div class="justify-between text-slate-600 sm:flex hidden h-full bg-white">
       <div class="flex">
         <a
@@ -273,15 +279,6 @@ onMounted(() => {
   </header>
 </template>
 
-<style>
-header {
-  --georchestra-primary: #85127e;
-  --georchestra-secondary: #1b1f3b;
-  --georchestra-primary-light: #85127e1a;
-  --georchestra-secondary-light: #1b1f3b1a;
-}
-</style>
-
 <style scoped>
 @tailwind base;
 @tailwind components;

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -4,10 +4,10 @@ module.exports = {
   theme: {
     extend: {
       colors: {
-        primary: 'var(--georchestra-primary)',
-        secondary: 'var(--georchestra-secondary)',
-        'primary-light': 'var(--georchestra-primary-light)',
-        'secondary-light': 'var(--georchestra-secondary-light)',
+        primary: 'var(--georchestra-header-primary)',
+        secondary: 'var(--georchestra-header-secondary)',
+        'primary-light': 'var(--georchestra-header-primary-light)',
+        'secondary-light': 'var(--georchestra-header-secondary-light)',
       },
     },
   },