From 6b180d30b3ddd008a1449746cd076c80dc7f2961 Mon Sep 17 00:00:00 2001
From: Chizu <chizu@youjo.love>
Date: Mon, 13 Mar 2023 17:56:48 +0900
Subject: [PATCH] Fix theme apply button so it updates instantly

I tried to do this while keeping the CSP changes but it seems like it is impossible, however, the themes do with with these enabled still and the CSP changes still working, so I am not sure why they were even implemented.
---
 .gitignore                                                | 3 ++-
 index.html                                                | 1 -
 src/components/settings_modal/tabs/theme_tab/theme_tab.js | 6 ++++--
 src/services/style_setter/style_setter.js                 | 4 +++-
 static/theme-holder.css                                   | 1 -
 5 files changed, 9 insertions(+), 6 deletions(-)
 delete mode 100644 static/theme-holder.css

diff --git a/.gitignore b/.gitignore
index a0be5c16..271b75c9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -9,4 +9,5 @@ selenium-debug.log
 config/local.json
 config/local.*.json
 docs/site/
-.vscode/
\ No newline at end of file
+.vscode/
+*.log
diff --git a/index.html b/index.html
index fda91b0f..79613dd2 100644
--- a/index.html
+++ b/index.html
@@ -10,7 +10,6 @@
     <link rel="stylesheet" href="/static/font/css/lato.css">
     <link rel="stylesheet" href="/static/mfm.css">
     <link rel="stylesheet" href="/static/custom.css">
-    <link rel="stylesheet" href="/static/theme-holder.css" id="theme-holder">
     <!--server-generated-meta-->
     <link rel="icon" type="image/png" href="/favicon.png">
     <link rel="manifest" href="/manifest.json">
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.js b/src/components/settings_modal/tabs/theme_tab/theme_tab.js
index d6ccd5ea..c89e5dab 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.js
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.js
@@ -115,7 +115,8 @@ export default {
       avatarRadiusLocal: '',
       avatarAltRadiusLocal: '',
       attachmentRadiusLocal: '',
-      tooltipRadiusLocal: ''
+      tooltipRadiusLocal: '',
+      chatMessageRadiusLocal: ''
     }
   },
   created () {
@@ -230,7 +231,8 @@ export default {
         avatar: this.avatarRadiusLocal,
         avatarAlt: this.avatarAltRadiusLocal,
         tooltip: this.tooltipRadiusLocal,
-        attachment: this.attachmentRadiusLocal
+        attachment: this.attachmentRadiusLocal,
+        chatMessage: this.chatMessageRadiusLocal
       }
     },
     preview () {
diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js
index 7f3efd97..543aa874 100644
--- a/src/services/style_setter/style_setter.js
+++ b/src/services/style_setter/style_setter.js
@@ -4,10 +4,12 @@ import { getColors, computeDynamicColor, getOpacitySlot } from '../theme_data/th
 
 export const applyTheme = (input) => {
   const { rules } = generatePreset(input)
+  const head = document.head
   const body = document.body
   body.classList.add('hidden')
 
-  const styleEl = document.getElementById('theme-holder')
+  const styleEl = document.createElement('style')
+  head.appendChild(styleEl)
   const styleSheet = styleEl.sheet
 
   styleSheet.toString()
diff --git a/static/theme-holder.css b/static/theme-holder.css
deleted file mode 100644
index 3e884036..00000000
--- a/static/theme-holder.css
+++ /dev/null
@@ -1 +0,0 @@
-// This file intentionally left blank