From c793799161838f26249abfa6963b7b8aeb9a077f Mon Sep 17 00:00:00 2001
From: Kasper Seweryn <github@wvffle.net>
Date: Thu, 26 Jan 2023 14:35:35 +0100
Subject: [PATCH] feat(ui): respect custom css

Part-of: <https://dev.funkwhale.audio/funkwhale/funkwhale/-/merge_requests/2338>
---
 front/src/App.vue           |  4 +++-
 front/src/store/instance.ts | 10 ++++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/front/src/App.vue b/front/src/App.vue
index 51bdf2a03..d72b51aed 100644
--- a/front/src/App.vue
+++ b/front/src/App.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { QueueTrack } from '~/composables/audio/queue'
 
-import { useIntervalFn, useToggle, useWindowSize } from '@vueuse/core'
+import { useIntervalFn, useStyleTag, useToggle, useWindowSize } from '@vueuse/core'
 import { computed, nextTick, onMounted, ref, watchEffect } from 'vue'
 
 import { useQueue } from '~/composables/audio/queue'
@@ -49,6 +49,8 @@ const customStylesheets = computed(() => {
   return store.state.instance.frontSettings.additionalStylesheets ?? []
 })
 
+useStyleTag(computed(() => store.state.instance.settings.ui.custom_css.value))
+
 // Fake content
 onMounted(async () => {
   await nextTick()
diff --git a/front/src/store/instance.ts b/front/src/store/instance.ts
index e446953b0..f2f1a55a7 100644
--- a/front/src/store/instance.ts
+++ b/front/src/store/instance.ts
@@ -108,11 +108,16 @@ interface SubsonicSettings {
   enabled: { value: boolean }
 }
 
+interface UISettings {
+  custom_css: { value: string }
+}
+
 interface Settings {
   instance: InstanceSettings
   users: UsersSettings
   moderation: ModerationSettings
   subsonic: SubsonicSettings
+  ui: UISettings
 }
 
 const logger = useLogger()
@@ -169,6 +174,11 @@ const store: Module<State, RootState> = {
         enabled: {
           value: true
         }
+      },
+      ui: {
+        custom_css: {
+          value: ''
+        }
       }
     }
   },