iter(g317): 文字选区统一为主题色淡底,暗色下不再突兀
This commit is contained in:
@@ -3239,6 +3239,15 @@
|
||||
"motivation": "backlog 清空时每轮都要自己翻最大 g 号再自补,历史上撞过号、靠 rebase 收拾;诊断命令明明已经把 backlog 读进内存,顺带算一个 nextId 是举手之劳。",
|
||||
"acceptance": "① ua loop 文本输出在「需自补」时带「下一条可用编号 gNNN」;② --json 增 nextId 字段供脚本直接用;③ CLI 清单与 ITERATION.md 的诊断入口描述同步;④ npm run doctor / check 全绿。",
|
||||
"notes": ""
|
||||
},
|
||||
{
|
||||
"id": "g317",
|
||||
"domain": "visual",
|
||||
"status": "open",
|
||||
"title": "文字选区跟随主题:默认蓝底选区在暗色下突兀",
|
||||
"motivation": "全站没有任何 ::selection 规则,用户选中文本时走浏览器默认选区——亮色下是系统蓝、暗色下是亮蓝底黑字,与 --ua-* 主题色系完全不搭,代码块 / diffView 这类大量复制的场景尤其刺眼;caret-color 已跟随 accent,选区却没有,两者不一致。",
|
||||
"acceptance": "① ui.css 新增全局 ::selection 规则,选区底色由既有 --ua-color-accent 经 color-mix 派生(低透明度,与焦点环同族),不新增任何硬编码颜色;② 亮 / 暗 / 高对比主题下选区均可辨认,audit:visual / audit:contrast / audit:surface 全绿;③ 文档(llms-full.txt 经 npm run docs 同步)令牌说明处补一句选区口径;④ npm run check 通过。",
|
||||
"notes": ""
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
+3
-2
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"$schema": "ui-arch-registry-index/0.1",
|
||||
"generatedAt": "2026-10-26T16:47:04.670Z",
|
||||
"generatedAt": "2026-10-26T16:55:18.044Z",
|
||||
"repoRoot": ".",
|
||||
"packages": [
|
||||
{
|
||||
@@ -121,7 +121,8 @@
|
||||
"引入:在应用入口 import '@ui-arch/tokens/tokens.css'",
|
||||
"消费:组件样式一律 var(--ua-color-accent) 这类变量,不写死色值",
|
||||
"暗色:根元素设 data-theme=dark,变量值自动切换",
|
||||
"扩展:新令牌先同时加进 tokens.css 与 tokens.json,再重新生成文档站"
|
||||
"扩展:新令牌先同时加进 tokens.css 与 tokens.json,再重新生成文档站",
|
||||
"选区:库内文字选区 ::selection 统一为主题色淡底(皮肤包已全局处理),应用侧不必再写"
|
||||
]
|
||||
},
|
||||
"version": "0.1.0",
|
||||
|
||||
+2
-1
@@ -1,6 +1,6 @@
|
||||
# @ui-arch 组件库 Agent 文档(无图形版)
|
||||
|
||||
> 自动生成于 2026-10-26T16:47:04.670Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
|
||||
> 自动生成于 2026-10-26T16:55:18.044Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
|
||||
> 组件 = 普通函数,传 props 返回 DOM;状态用 signal 双向绑定:读 signal() 写 signal(v)。
|
||||
|
||||
## 快速上手
|
||||
@@ -29,6 +29,7 @@
|
||||
2. 消费:组件样式一律 var(--ua-color-accent) 这类变量,不写死色值
|
||||
3. 暗色:根元素设 data-theme=dark,变量值自动切换
|
||||
4. 扩展:新令牌先同时加进 tokens.css 与 tokens.json,再重新生成文档站
|
||||
5. 选区:库内文字选区 ::selection 统一为主题色淡底(皮肤包已全局处理),应用侧不必再写
|
||||
|
||||
### @ui-arch/ui
|
||||
|
||||
|
||||
@@ -26,7 +26,8 @@
|
||||
"引入:在应用入口 import '@ui-arch/tokens/tokens.css'",
|
||||
"消费:组件样式一律 var(--ua-color-accent) 这类变量,不写死色值",
|
||||
"暗色:根元素设 data-theme=dark,变量值自动切换",
|
||||
"扩展:新令牌先同时加进 tokens.css 与 tokens.json,再重新生成文档站"
|
||||
"扩展:新令牌先同时加进 tokens.css 与 tokens.json,再重新生成文档站",
|
||||
"选区:库内文字选区 ::selection 统一为主题色淡底(皮肤包已全局处理),应用侧不必再写"
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -5143,6 +5143,14 @@ h5.ua-type-title { font-size: var(--ua-font-size-md); }
|
||||
background: transparent; /* 双向滚动容器的右下角不留白块 */
|
||||
}
|
||||
|
||||
/* ---- 文字选区:accent 淡底(浏览器默认蓝底选区在暗色 / 高对比主题下与令牌皮肤割裂,且 caret 已跟随 accent、选区却没跟,两者不一致) ---- */
|
||||
[class^='ua-']::selection,
|
||||
[class^='ua-'] ::selection,
|
||||
[class*=' ua-']::selection,
|
||||
[class*=' ua-'] ::selection {
|
||||
background: color-mix(in srgb, var(--ua-color-accent) var(--ua-alpha-line), transparent); /* 选区底 = 主题色 30% 淡档:文字仍直接透底可读,选中区与焦点环 / 选中底同族 */
|
||||
}
|
||||
|
||||
/* ---- 时间选择(时 / 分两列弹层) ---- */
|
||||
.ua-timepicker {
|
||||
position: relative;
|
||||
|
||||
Reference in New Issue
Block a user