yudao
/
admin-vben
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vben.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(@vben/web-ele): fixed some style issues in dark mode (#4436) 

* fix(@vben/web-ele): fixed some style issues in dark mode

* fix: lint

---------

Co-authored-by: Vben <ann.vben@gmail.com>
pull/48/MERGE
zhuizhubf 2024-09-19 23:11:41 +08:00 committed by GitHub
parent df48409814
commit a634ec3692
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 30 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
packages/effects/hooks/src/use-design-tokens.ts
View File

@ -185,6 +185,7 @@ export function useElementPlusDesignTokens() {
'--el-bg-color-page': getCssVariableValue('--background-deep'),
'--el-border-color': border,
'--el-border-color-dark': border,
'--el-border-color-extra-light': border,
'--el-border-color-hover': accent,
'--el-border-color-light': border,
'--el-border-color-lighter': border,
@ -195,26 +196,36 @@ export function useElementPlusDesignTokens() {
'--el-color-danger-light-3': getCssVariableValue('--destructive-400'),
'--el-color-danger-light-5': getCssVariableValue('--destructive-300'),
'--el-color-danger-light-7': getCssVariableValue('--destructive-200'),
'--el-color-danger-light-8': getCssVariableValue('--destructive-100'),
'--el-color-danger-light-8': isDark.value
? border
: getCssVariableValue('--destructive-100'),
'--el-color-danger-light-9': isDark.value
? accent
: getCssVariableValue('--destructive-50'),
'--el-color-danger-light-9': getCssVariableValue('--destructive-50'),
'--el-color-error': getCssVariableValue('--destructive-500'),
'--el-color-error-dark-2': getCssVariableValue('--destructive'),
'--el-color-error-light-3': getCssVariableValue('--destructive-400'),
'--el-color-error-light-5': getCssVariableValue('--destructive-300'),
'--el-color-error-light-7': getCssVariableValue('--destructive-200'),
'--el-color-error-light-8': getCssVariableValue('--destructive-100'),
'--el-color-error-light-8': isDark.value
? border
: getCssVariableValue('--destructive-100'),
'--el-color-error-light-9': isDark.value
? accent
: getCssVariableValue('--destructive-50'),
'--el-color-error-light-9': getCssVariableValue('--destructive-50'),
'--el-color-info-light-8': border,
'--el-color-info-light-9': background,
'--el-color-primary': getCssVariableValue('--primary-500'),
'--el-color-primary-dark-2': getCssVariableValue('--primary'),
'--el-color-primary-light-3': getCssVariableValue('--primary-400'),
'--el-color-primary-light-5': getCssVariableValue('--primary-300'),
'--el-color-primary-light-7': getCssVariableValue('--primary-200'),
'--el-color-primary-light-8': getCssVariableValue('--primary-100'),
'--el-color-primary-light-8': isDark.value
? border
: getCssVariableValue('--primary-100'),
'--el-color-primary-light-9': isDark.value
? accent
: getCssVariableValue('--primary-50'),
@ -224,17 +235,26 @@ export function useElementPlusDesignTokens() {
'--el-color-success-light-3': getCssVariableValue('--success-400'),
'--el-color-success-light-5': getCssVariableValue('--success-300'),
'--el-color-success-light-7': getCssVariableValue('--success-200'),
'--el-color-success-light-8': getCssVariableValue('--success-100'),
'--el-color-success-light-8': isDark.value
? border
: getCssVariableValue('--success-100'),
'--el-color-success-light-9': isDark.value
? accent
: getCssVariableValue('--success-50'),
'--el-color-success-light-9': getCssVariableValue('--success-50'),
'--el-color-warning': getCssVariableValue('--warning-500'),
'--el-color-warning-dark-2': getCssVariableValue('--warning'),
'--el-color-warning-light-3': getCssVariableValue('--warning-400'),
'--el-color-warning-light-5': getCssVariableValue('--warning-300'),
'--el-color-warning-light-7': getCssVariableValue('--warning-200'),
'--el-color-warning-light-8': getCssVariableValue('--warning-100'),
'--el-color-warning-light-8': isDark.value
? border
: getCssVariableValue('--warning-100'),
'--el-color-warning-light-9': isDark.value
? accent
: getCssVariableValue('--warning-50'),
'--el-color-warning-light-9': getCssVariableValue('--warning-50'),
'--el-fill-color': getCssVariableValue('--accent'),
'--el-fill-color-blank': background,
'--el-fill-color-light': getCssVariableValue('--accent'),
'--el-text-color-primary': getCssVariableValue('--foreground'),