diff --git a/index.html b/index.html index 4b54d7f5..56d8e4a2 100644 --- a/index.html +++ b/index.html @@ -325,7 +325,7 @@ }, glass: { background: '#0B1322', - primary: '#E4B863', + primary: '#8D51F9', }, } diff --git a/src/composables/useThemeCustomizer.ts b/src/composables/useThemeCustomizer.ts index a2011ba8..174d932f 100644 --- a/src/composables/useThemeCustomizer.ts +++ b/src/composables/useThemeCustomizer.ts @@ -72,7 +72,6 @@ export interface ThemeCustomizerSettings { type VuetifyThemeApi = ReturnType const defaultPrimaryColor = themeCustomizerPrimaryColors[0].value -const glassDefaultPrimaryColor = '#E4B863' const validLayouts: ThemeCustomizerLayout[] = ['vertical', 'collapsed', 'horizontal'] const validRadii: ThemeCustomizerRadius[] = ['none', 'small', 'default', 'large', 'extra'] const validShadows: readonly ThemeCustomizerShadow[] = themeCustomizerShadowLevels @@ -206,15 +205,15 @@ function getTextColorForHex(backgroundColor: string) { return luminance > 0.68 ? '#3A3541' : '#FFFFFF' } -/** 将主色写入 Vuetify 运行时主题,默认主色下保留玻璃主题的香槟强调色。 */ +/** 将主色写入所有 Vuetify 运行时主题。 */ export function applyPrimaryColorToVuetify(color: string, themeApi: VuetifyThemeApi) { if (!isHexColor(color)) return - for (const [themeName, themeDefinition] of Object.entries(themeApi.themes.value)) { - const themePrimaryColor = themeName === 'glass' && color === defaultPrimaryColor ? glassDefaultPrimaryColor : color + const onPrimaryColor = getTextColorForHex(color) - themeDefinition.colors.primary = themePrimaryColor - themeDefinition.colors['on-primary'] = getTextColorForHex(themePrimaryColor) + for (const themeDefinition of Object.values(themeApi.themes.value)) { + themeDefinition.colors.primary = color + themeDefinition.colors['on-primary'] = onPrimaryColor } const activePrimaryColor = themeApi.current.value.colors.primary diff --git a/src/plugins/vuetify/theme.ts b/src/plugins/vuetify/theme.ts index 05d72eb3..35bc5e32 100644 --- a/src/plugins/vuetify/theme.ts +++ b/src/plugins/vuetify/theme.ts @@ -213,14 +213,14 @@ const theme: VuetifyOptions['theme'] = { glass: { dark: true, colors: { - 'primary': '#E4B863', + 'primary': '#8D51F9', 'secondary': '#7C9CC4', 'on-secondary': '#07101C', 'success': '#69C59A', 'info': '#7C9CC4', 'warning': '#E4B863', 'error': '#FF7B7B', - 'on-primary': '#171106', + 'on-primary': '#FFFFFF', 'on-success': '#07150F', 'on-warning': '#171106', 'background': '#0B1322', diff --git a/src/utils/__tests__/themePalette.spec.ts b/src/utils/__tests__/themePalette.spec.ts index b622f48a..9d6e947f 100644 --- a/src/utils/__tests__/themePalette.spec.ts +++ b/src/utils/__tests__/themePalette.spec.ts @@ -13,7 +13,7 @@ describe('theme palette', () => { expect(getThemeColorScheme('glass')).toBe('dark') expect(themeRootPalettes.glass).toEqual({ background: '#0B1322', - primary: '#E4B863', + primary: '#8D51F9', }) }) diff --git a/src/utils/themePalette.ts b/src/utils/themePalette.ts index 7d0a813e..2329ef97 100644 --- a/src/utils/themePalette.ts +++ b/src/utils/themePalette.ts @@ -35,7 +35,7 @@ export const themeRootPalettes: Record = { }, glass: { background: '#0B1322', - primary: '#E4B863', + primary: '#8D51F9', }, }