From 5b46371356d26c865f196c1de1ab7aead41ef450 Mon Sep 17 00:00:00 2001
From: Samidy <samidy@proton.me>
Date: Sat, 4 Oct 2025 11:50:17 +0300
Subject: [PATCH] background change when selecting another theme

---
 docs/.vitepress/theme/components/ColorPicker.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/docs/.vitepress/theme/components/ColorPicker.vue b/docs/.vitepress/theme/components/ColorPicker.vue
index dbe619004..98e15e41e 100644
--- a/docs/.vitepress/theme/components/ColorPicker.vue
+++ b/docs/.vitepress/theme/components/ColorPicker.vue
@@ -132,16 +132,16 @@ const updateThemeColor = (colorName: ColorNames) => {
 
   const htmlElement = document.documentElement
   if (colorName === 'halloween') {
-    htmlElement.setAttribute('data-halloween-theme', 'true')
+    htmlElement.classList.add('theme-halloween')
   } else {
-    htmlElement.removeAttribute('data-halloween-theme')
+    htmlElement.classList.remove('theme-halloween')
   }
 }
 
 // Set Halloween theme ASAP if its the pref
 const storedTheme = localStorage.getItem('preferred-color')
 if (!storedTheme || storedTheme === '"halloween"') {
-  document.documentElement.setAttribute('data-halloween-theme', 'true')
+  document.documentElement.classList.add('theme-halloween')
 }
 
 // Initialize theme color
@@ -150,7 +150,7 @@ updateThemeColor(selectedColor.value)
 // halloween stuff
 onMounted(() => {
   if (selectedColor.value === 'halloween') {
-    document.documentElement.setAttribute('data-halloween-theme', 'true')
+    document.documentElement.classList.add('theme-halloween')
   }
   // Re-apply the theme to ensure everything is initialized
   updateThemeColor(selectedColor.value)