diff --git a/docs/.vitepress/theme/components/ColorPicker.vue b/docs/.vitepress/theme/components/ColorPicker.vue index cce2ef535..efafa54ba 100644 --- a/docs/.vitepress/theme/components/ColorPicker.vue +++ b/docs/.vitepress/theme/components/ColorPicker.vue @@ -8,7 +8,7 @@ import type { Theme } from '../themes/types' import Switch from './Switch.vue' type ColorNames = keyof typeof colors -const selectedColor = useStorage('preferred-color', 'christmas') +const selectedColor = useStorage('preferred-color', 'swarm') // Use the theme system const { amoledEnabled, setAmoledEnabled, setTheme, state, mode, themeName } = useTheme() @@ -196,13 +196,7 @@ const normalizeColorName = (colorName: string) => colorName.slice(1).replaceAll(/-/g, ' ') onMounted(async () => { - // apply saved theme on load - if (selectedColor.value) { - const theme = generateThemeFromColor(selectedColor.value) - themeRegistry[`color-${selectedColor.value}`] = theme - await nextTick() - setTheme(`color-${selectedColor.value}`) - } + // Don't auto-apply color theme - only apply when user explicitly selects // Wait for next tick to ensure theme handler is fully initialized await nextTick() }) diff --git a/docs/.vitepress/theme/components/Feedback.vue b/docs/.vitepress/theme/components/Feedback.vue index 6660dd44c..162e1810d 100644 --- a/docs/.vitepress/theme/components/Feedback.vue +++ b/docs/.vitepress/theme/components/Feedback.vue @@ -153,7 +153,7 @@ const toggleCard = () => (isCardShown.value = !isCardShown.value) diff --git a/docs/.vitepress/theme/themes/themeHandler.ts b/docs/.vitepress/theme/themes/themeHandler.ts index eb8ce5a29..682f6c7f7 100644 --- a/docs/.vitepress/theme/themes/themeHandler.ts +++ b/docs/.vitepress/theme/themes/themeHandler.ts @@ -21,7 +21,6 @@ import { themeRegistry } from './configs' const STORAGE_KEY_THEME = 'vitepress-theme-name' const STORAGE_KEY_MODE = 'vitepress-display-mode' const STORAGE_KEY_AMOLED = 'vitepress-amoled-enabled' -const STORAGE_KEY_THEME_DATA = 'vitepress-theme-data' export class ThemeHandler { private state = ref({ @@ -43,6 +42,7 @@ export class ThemeHandler { const savedMode = localStorage.getItem(STORAGE_KEY_MODE) as DisplayMode | null const savedAmoled = localStorage.getItem(STORAGE_KEY_AMOLED) === 'true' + // Set theme if (themeRegistry[savedTheme]) { this.state.value.currentTheme = savedTheme this.state.value.theme = themeRegistry[savedTheme] @@ -74,7 +74,7 @@ export class ThemeHandler { }) } - public applyTheme() { + private applyTheme() { if (typeof document === 'undefined') return const { currentMode, theme } = this.state.value @@ -390,4 +390,4 @@ export function useTheme() { toggleAmoled: () => handler.toggleAmoled(), state } -} +} \ No newline at end of file