|
|
|
@ -19,10 +19,7 @@ const SIDER_DARK_BG_COLOR = '--sider-dark-bg-color';
@@ -19,10 +19,7 @@ const SIDER_DARK_BG_COLOR = '--sider-dark-bg-color';
|
|
|
|
|
const SIDER_DARK_DARKEN_BG_COLOR = '--sider-dark-darken-bg-color'; |
|
|
|
|
const SIDER_LIGHTEN_BG_COLOR = '--sider-dark-lighten-bg-color'; |
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
* 更改顶部标题的背景颜色 |
|
|
|
|
* @param color |
|
|
|
|
*/ |
|
|
|
|
/** 更改顶部标题的背景颜色 */ |
|
|
|
|
export function updateHeaderBgColor(color?: string) { |
|
|
|
|
const appStore = useAppStore(); |
|
|
|
|
const darkMode = appStore.getDarkMode === ThemeEnum.DARK; |
|
|
|
@ -41,7 +38,7 @@ export function updateHeaderBgColor(color?: string) {
@@ -41,7 +38,7 @@ export function updateHeaderBgColor(color?: string) {
|
|
|
|
|
setCssVar(HEADER_BG_HOVER_COLOR_VAR, hoverColor); |
|
|
|
|
setCssVar(HEADER_MENU_ACTIVE_BG_COLOR_VAR, hoverColor); |
|
|
|
|
|
|
|
|
|
// 确定色值深浅,自动切换主题
|
|
|
|
|
// 确定色值深浅,自动切换主题
|
|
|
|
|
const isDark = colorIsDark(color!); |
|
|
|
|
appStore.setProjectConfig({ |
|
|
|
|
headerSetting: { |
|
|
|
@ -50,10 +47,7 @@ export function updateHeaderBgColor(color?: string) {
@@ -50,10 +47,7 @@ export function updateHeaderBgColor(color?: string) {
|
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
* 更改左侧菜单的背景颜色 |
|
|
|
|
* @param color bg color |
|
|
|
|
*/ |
|
|
|
|
/** 更改左侧菜单的背景颜色 */ |
|
|
|
|
export function updateSidebarBgColor(color?: string) { |
|
|
|
|
const appStore = useAppStore(); |
|
|
|
|
|
|
|
|
@ -69,7 +63,7 @@ export function updateSidebarBgColor(color?: string) {
@@ -69,7 +63,7 @@ export function updateSidebarBgColor(color?: string) {
|
|
|
|
|
setCssVar(SIDER_DARK_DARKEN_BG_COLOR, darken(color!, 6)); |
|
|
|
|
setCssVar(SIDER_LIGHTEN_BG_COLOR, lighten(color!, 5)); |
|
|
|
|
|
|
|
|
|
// 只有当背景颜色为fff时,菜单的主题才会变为浅色
|
|
|
|
|
// 只有当背景颜色为fff时,菜单的主题才会变为浅色
|
|
|
|
|
const isLight = ['#fff', '#ffffff'].includes(color!.toLowerCase()); |
|
|
|
|
|
|
|
|
|
appStore.setProjectConfig({ |
|
|
|
|