feat(style): 前台强制切换浅色主题,保护后台管理页暗色
- variables.css: 新增 body[data-frontend]:not(.admin-body) 作用域浅色系变量 包含 --accent-purple/pink/blue 三色花点缀色,圆角上限 8px 硬边设计 - theme-protection.css: 前台页面及表单控件强制 color-scheme: light - default.vue: onMounted 时为 body 注入 data-frontend=true 标记 - dashboard.vue: 根容器添加 admin-body class,阻断前台浅色变量污染
This commit is contained in:
@@ -21,6 +21,15 @@
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
/* ===== 前台页面强制浅色 color-scheme(防止系统深色干扰)===== */
|
||||
body[data-frontend="true"]:not(.admin-body),
|
||||
body[data-frontend="true"]:not(.admin-body) input,
|
||||
body[data-frontend="true"]:not(.admin-body) textarea,
|
||||
body[data-frontend="true"]:not(.admin-body) select,
|
||||
body[data-frontend="true"]:not(.admin-body) button {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
/* 保护表单元素外观,但不强锁 color-scheme = none(none 会导致控件 fallback 到浅色) */
|
||||
input[type='text'],
|
||||
input[type='email'],
|
||||
|
||||
Reference in New Issue
Block a user