laobinghu
4df5c13976
Remove custom CSS variable overrides, use Element Plus built-in dark mode with VueUse useDark
43 lines
1.1 KiB
CSS
43 lines
1.1 KiB
CSS
/* 自定义 CSS 变量（Element Plus 组件由其内置暗色模式处理） */
|
||
:root {
|
||
/* 侧边栏变量 */
|
||
--sidebar-bg: #1e293b;
|
||
--sidebar-header-bg: #0f172a;
|
||
--sidebar-hover-bg: #334155;
|
||
--sidebar-text: #94a3b8;
|
||
--sidebar-active-text: #ffffff;
|
||
--sidebar-active-bg: #3b82f6;
|
||
|
||
/* 通用文本变量（用于非 Element Plus 元素） */
|
||
--el-text-color-primary: #303133;
|
||
--el-text-color-regular: #606266;
|
||
--el-text-color-secondary: #909399;
|
||
--el-border-color: #dcdfe6;
|
||
--el-bg-color: #ffffff;
|
||
--el-bg-color-page: #f2f3f5;
|
||
}
|
||
|
||
html.dark {
|
||
/* 侧边栏暗色变量 */
|
||
--sidebar-bg: #0f172a;
|
||
--sidebar-header-bg: #020617;
|
||
--sidebar-hover-bg: #1e293b;
|
||
--sidebar-text: #cbd5e1;
|
||
--sidebar-active-text: #ffffff;
|
||
--sidebar-active-bg: #3b82f6;
|
||
|
||
/* 通用文本暗色变量 */
|
||
--el-text-color-primary: #e5eaf3;
|
||
--el-text-color-regular: #cfd3dc;
|
||
--el-text-color-secondary: #a3a6ad;
|
||
--el-border-color: #4c4d4f;
|
||
--el-bg-color: #141414;
|
||
--el-bg-color-page: #0a0a0a;
|
||
}
|
||
|
||
/* 全局基础样式 */
|
||
body {
|
||
color: var(--el-text-color-primary);
|
||
background-color: var(--el-bg-color-page);
|
||
}
|