用无头浏览器把评论区的计算样式逐条量出来之后,确认「不好看」里有三处 是硬指标不达标,不是主观审美: · 时间戳 #a4abb5 对白底对比度 2.32 → 4.83(WCAG AA 正文需 ≥4.5) · 回复按钮 #8a9099 对比度 3.22 → 6.0 (可点元素同样需 ≥4.5) · 顶层分隔线 #f5f6f8 对白底 ≈1.04 → 1.17(可见,此前等于没有分隔) 顺带修掉一个只在窄屏出现的真 bug:768px 断点里 avatar 的 width 组 只写了容器与占位符、漏了 img,容器缩到 36px 而图片仍是 42px, 溢出 6px 压在正文上。400px 断点同类问题一并补齐。 这个 bug 之所以能活过多个版本,是因为几何探针量的是容器宽度 —— 容器确实等于 36,98 条断言全绿。已在探针里新增 3 条直接量 img 的断言, 并在反向验证里加入对应的注入用例。 其余为层次与细节调整: · 新增 .comments 作用域内的局部设计变量层(--yq-*),信息性颜色带兜底 · 标题加主色竖条;外框圆角 4→6、阴影对齐整站 .widget 的档位 · 头像边框改外描边,不占布局,直径保持精确 42px · 缩进 20→18px、引导线加深;正文 14→14.5px、行高 1.8 · 新增 :target 高亮与 prefers-reduced-motion 分支 保持不变的 DOM 契约(已在文件头注明):.yang-comment 仍为 grid、 子容器缩进仍只加 padding-left、头像断点节奏仍为 42/36/32。 验证:verify_all.sh 30 组全通过;本地几何 107/0、反向注入 25/0、 AJAX 34/0;线上四视口几何 52/0;线上实测时间 4.83、按钮 6.0、分隔线 1.17。
14 lines
609 B
CSS
14 lines
609 B
CSS
/*
|
|
Theme Name: Kratos_Yang
|
|
Text Domain: kratos_Yang
|
|
Version: 3.2.20
|
|
Requires PHP: 7.0
|
|
Description: 这是一个Kratos主题的分支版本,用来增加一些定制化功能。
|
|
Tags: 博客, 双栏, 响应式, 自定义背景, 自定义颜色, 自定义图标, 自定义菜单, 特色图像, 收录优化, 邮件中心, 主题选项, 小工具, 文章置顶, 无障碍友好
|
|
Author: Yongquan Yang
|
|
Author URI: https://yangyq.net
|
|
Theme URI: https://code.yangyq.net/laoyang/wordpress-kratos-yang
|
|
License: MIT License
|
|
License URI: https://code.yangyq.net/laoyang/wordpress-kratos-yang/src/branch/main/LICENSE
|
|
*/
|