Repository navigation
fix: 修复玻璃浮窗内次级文字与 hover 提示的可读性 - #71
Merged
Merged
Conversation
浮窗的标题栏与操作栏直接压在 Acrylic 玻璃上,可读性只由极薄的 --popup-glass-tint 保证,而 --text-secondary 是按「压在实色面板上」 选的中间灰,在玻璃的亮暗调制下失效。 - 浮窗作用域内提级 --text-secondary:浅色 #515154 → #262628, 深色 #C0C0C5 → #EDEDF0。浅色侧最低对比度 2.57:1 → 4.92:1,全部 达标;深色侧 2.09:1 → 2.92:1。用 :root:where(:not(.reduce-transparency)) 收窄,特异性保持 (0,1,0) 与本文件既有 token 覆盖约定一致;reduce 媒体查询路径在 reduce 块内显式还原基值。 - 新增 --copy-hover-text,浮窗内指向 --popup-text-primary。原先 CopyButton 的 hover 直接读全局 --text-primary,深色下是 #F5F5F7 而非浮窗的 #FFFFFF,次级文字提级后 hover 与静止态撞色(ΔE76 2.81)。 改用独立 token 后深色 hover 恢复到 ΔE76 6.37,history 窗口不受影响。 - 浮窗内提级 --hover-bg / --active-bg:同样的 4%/6% 叠加,压在不透明 底上是 ΔE76 3.46/6.79,压在玻璃上只剩 2.30/2.69,正好落在 JND 上。 提级到 0.10/0.12 后恢复到不透明窗口的提示强度;reduce 路径还原成 全局值,避免在近实色衬底上变成过重的压块。 八种组合(系统偏好 × 应用开关 × 浅深)已在 Chromium 与 jsdom 双引擎 验证,history 窗口无 .popup-container 祖先时 token 保持全局值。
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
背景
浮窗的标题栏与底部操作栏直接压在 Acrylic 玻璃上,可读性只由极薄的
--popup-glass-tint(浅 0.10 / 深 0.16)保证。而--text-secondary是按「压在实色面板上」选的中间灰,在玻璃的亮暗调制下失效。实机采样(6 类背景 × 浅深 × normal/reduce)确认:修复前 normal 模式下语言方向标签、复制按钮、快捷键提示、provider 名四处全部低于 4.5:1,最差 2.09:1。
改动
1. 浮窗作用域内提级
--text-secondary#515154(最差 2.57:1)#262628(最差 4.92:1)#C0C0C5(最差 2.09:1)#EDEDF0(最差 2.92:1)用
:root:where(:not(.reduce-transparency))收窄,:where()把特异性压回 (0,1,0),与本文件既有的 token 覆盖约定一致(直接写:not()是 (0,2,0),会让将来照约定补的规则被静默压掉)。reduce 媒体查询路径在 reduce 块内显式还原基值——系统偏好不改变 class,两边的:not()都成立。2. 新增
--copy-hover-textCopyButton的 hover 原先直接读全局--text-primary,深色下是#F5F5F7而非浮窗的#FFFFFF。次级文字提级后 hover 与静止态撞色(ΔE76 2.81,贴着 JND)。抽成独立 token 后浮窗内指向
--popup-text-primary,深色 hover 恢复到 ΔE76 6.37;history窗口无.popup-container祖先,token 保持全局值,行为一字不变。3. 浮窗内提级
--hover-bg/--active-bg玻璃把 hover 背景稀释掉了:
旧值正好落在 JND 上,等于不存在。reduce 路径还原成全局值——那里的衬底是 0.94/0.92 近实色,没有稀释,沿用提级值会变成 ΔE76 8.46 / 11.22 的重压块。
验证
dist中 token 定义与hover:text-[var(--copy-hover-text)]规则均在npx tsc --noEmitexit 0npm test5 文件 / 33 测试全过已知未解决
--text-tertiary在 normal 模式下仍约 1.19:1(深)/ 1.65:1(浅),折叠态箭头叠加opacity: 0.55后 ΔE76 仅 3.2。逐 token 调色是死路(深色纯白也只有 3.41:1),需局部衬底或登记为已知缺口,另行决策。