Compare commits

..

No commits in common. "df265614b8f107afd30a8deaa9580aa6f8a68d98" and "09e43b4954be10ebb61ce13694faae23c942f31d" have entirely different histories.

3 changed files with 6 additions and 12 deletions

View file

@ -8,7 +8,7 @@ import type { Theme } from '../themes/types'
import Switch from './Switch.vue' import Switch from './Switch.vue'
type ColorNames = keyof typeof colors type ColorNames = keyof typeof colors
const selectedColor = useStorage<ColorNames>('preferred-color', 'christmas') const selectedColor = useStorage<ColorNames>('preferred-color', 'swarm')
// Use the theme system // Use the theme system
const { amoledEnabled, setAmoledEnabled, setTheme, state, mode, themeName } = useTheme() const { amoledEnabled, setAmoledEnabled, setTheme, state, mode, themeName } = useTheme()
@ -196,13 +196,7 @@ const normalizeColorName = (colorName: string) =>
colorName.slice(1).replaceAll(/-/g, ' ') colorName.slice(1).replaceAll(/-/g, ' ')
onMounted(async () => { onMounted(async () => {
// apply saved theme on load // Don't auto-apply color theme - only apply when user explicitly selects
if (selectedColor.value) {
const theme = generateThemeFromColor(selectedColor.value)
themeRegistry[`color-${selectedColor.value}`] = theme
await nextTick()
setTheme(`color-${selectedColor.value}`)
}
// Wait for next tick to ensure theme handler is fully initialized // Wait for next tick to ensure theme handler is fully initialized
await nextTick() await nextTick()
}) })

View file

@ -153,7 +153,7 @@ const toggleCard = () => (isCardShown.value = !isCardShown.value)
<span <span
:class=" :class="
isCardShown === false isCardShown === false
? `i-lucide:mail w-6 h-6 text-white` ? `i-lucide:mail w-6 h-6 text-$vp-c-text-1`
: `i-lucide:mail-x w-6 h-6 text-white` : `i-lucide:mail-x w-6 h-6 text-white`
" "
/> />

View file

@ -21,7 +21,6 @@ import { themeRegistry } from './configs'
const STORAGE_KEY_THEME = 'vitepress-theme-name' const STORAGE_KEY_THEME = 'vitepress-theme-name'
const STORAGE_KEY_MODE = 'vitepress-display-mode' const STORAGE_KEY_MODE = 'vitepress-display-mode'
const STORAGE_KEY_AMOLED = 'vitepress-amoled-enabled' const STORAGE_KEY_AMOLED = 'vitepress-amoled-enabled'
const STORAGE_KEY_THEME_DATA = 'vitepress-theme-data'
export class ThemeHandler { export class ThemeHandler {
private state = ref<ThemeState>({ private state = ref<ThemeState>({
@ -43,6 +42,7 @@ export class ThemeHandler {
const savedMode = localStorage.getItem(STORAGE_KEY_MODE) as DisplayMode | null const savedMode = localStorage.getItem(STORAGE_KEY_MODE) as DisplayMode | null
const savedAmoled = localStorage.getItem(STORAGE_KEY_AMOLED) === 'true' const savedAmoled = localStorage.getItem(STORAGE_KEY_AMOLED) === 'true'
// Set theme
if (themeRegistry[savedTheme]) { if (themeRegistry[savedTheme]) {
this.state.value.currentTheme = savedTheme this.state.value.currentTheme = savedTheme
this.state.value.theme = themeRegistry[savedTheme] this.state.value.theme = themeRegistry[savedTheme]
@ -74,7 +74,7 @@ export class ThemeHandler {
}) })
} }
public applyTheme() { private applyTheme() {
if (typeof document === 'undefined') return if (typeof document === 'undefined') return
const { currentMode, theme } = this.state.value const { currentMode, theme } = this.state.value