wait4x/blog
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
201 Commits 4 Branches 0 Tags
9df86cb05bb79852333c5a4f68b78c550ddc7671
Commit Graph
14 Commits
Author SHA1 Message Date
wait4xandGLM-5.3 9df86cb05b feat(fonts): 新增六款自托管字族（体积闸门内）（5i T9） 
用户拍板「字族扩展都补」。六款按三类各两款落地，全部单页增量 ≤150KB：
小薇（文学·宋体气质）、新晰黑（文学·现代黑）、得意黑（标题）、庆科黄油（标题·圆润）、
马善政毛笔与柳建毛草（书法），许可证均 OFL。

关键取舍：@fontsource 官方中文切片粒度太粗（每片约 33 字、单片 40KB+），一句话命中
7 片即 308–442KB/页，四款全部超闸门；即便用 subset-fonts.py 按站内用字重裁仍剩
205–346KB（笔画类字族单片就 50KB）。故改为从 google/fonts 取原始 TTF，按**字频序
细切**（约 19 字/片、单片 2–12KB），每族 99–100 片、族总量 0.5–1.2MB，浏览器只拉
命中的片。四个 @fontsource 依赖随之移除，package.json 净零变更。

实测单页增量（一句话场景）：xiaowei 44.9KB / huangyou 27.1KB / mashanzheng 45.7KB /
liujianmaocao 30.0KB / smiley 27.1KB / neoxihei 30.0KB——全部 PASS；
六族同页共 105KB。

接线（一处漏就静默失效，踩过两次）：
- rehype-class-whitelist 放行新类（不放行则 span 的 class 被整条剥掉，页面有字没脸）
- site-content 的 ALLOWED_PAGE_FONTS 与后台排版下拉同源补齐（三处下拉 + hint）
- font-needs 扩六个 key，保证「内容用到才加载」的按需契约继续成立
- global.css 六组规则含 .mom-text 作用域（5h 补的瞬间作用域不能漏）
- typography-classes.js（后台可视化面板单一事实源）35→42 项
- subset-fonts.py 新增 --split-ttf / --slices / --order-from（hwmc 的 --css 用法未动）

覆盖边界（已在 docs 与后台 hint 写明）：切片只含站内用字（约 1900 字），
新写生僻字会回落系统字族，需按 docs 命令重切。

验证: 构建 50 页 exit 0；content-lint 51 页 0/0/0；config-check 211 字段/66 hint；
      六类逐项 getComputedStyle 首项 = ZCOOL XiaoWei / ZCOOL QingKe HuangYou /
      Ma Shan Zheng / Liu Jian Mao Cao / Smiley Sans / LXGW Neo XiHei（6/6）；
      六族全部出现在 document.fonts；首页字体请求数保持 17（零回归）

Spec: 2026-11-02_blog-5i-fonts-polish (T9)

Co-authored-by: GLM-5.3
 2026-11-03 12:35:20 +08:00
wait4xandGLM-5.3 8d82aab213 fix(fonts): 字体切换真加载——按内容诉求注入，含瞬间排版类作用域缺口（5i T1） 
用户实测「字族渲染没有成功，尤其是字体的切换」。根因不是字体没做，是加载门禁错：
BaseLayout 把 serif/kai/kuaile/hwmc 四份字体 CSS 全关在 `track === 'reading'` 分支里，
技术轨文章与全站页面（默认 track='tech'）从不加载它们——于是 `.font-kai` 计算值虽是
`"LXGW WenKai Screen"`，但该 @font-face 根本不在文档字体集里，浏览器静默回退系统宋体。

- 新增 `src/lib/font-needs.ts`：`fontsFromText()` 纯函数 + `fontsForPage(pathname, track)`
  按路径取该页内容（文章正文 / home.yaml / about.yaml / opensource.yaml / 全部瞬间文本）
  与页面静态诉求（reading→serif；书架标题写死楷体→kai 等）算出所需字族集合
- BaseLayout 改为逐项按需注入（非阻塞 preload+onload 写法保留），noscript 同步；
  汇文明朝仍走 public 手工切片路径，network/font-display 未动
- **顺手补掉 5h 遗留的用户可见缺口**：瞬间富文本容器 class 是 `mom-text`，而全局排版类
  规则只覆盖 `.prose-*/.rich/.prose-body` → 瞬间里写 `font-kai`/`c-teal` 一直只有 class
  没有样式（新瞬间正是这么写的，用户看到的就是"没变色没换字"）。global.css 给 38 处
  选择器组补 `.mom-text`
- 另修自写 bug：en 路由切分 `slice(3)` 残留前导 `/` 导致 en 页按需字体全部落空，改 `slice(4)`

验证: 构建 exit 0（content-lint 51 页 0/0/0）；E2E 46/46；Playwright 实测
      技术轨文章 document.fonts 命中 LXGW WenKai Screen / WF-Hwmc / ZCOOL KuaiLe /
      Noto Serif SC，`.font-kai` 计算族 = LXGW 且 check=true；
      首页仍为基线（零增量）；瞬间页因有 font-kai 内容而命中 LXGW；
      书评页只拉 serif（41 片，0 kai 0 汇文）

Spec: 2026-11-02_blog-5i-fonts-polish (T1)

Co-authored-by: GLM-5.3
 2026-11-03 11:28:51 +08:00
wait4xandGLM-5.3 aaa9cd9274 feat(typography): 全站三层排版——富文本/页面级覆盖/艺术字体类 
- 层 1 所有页面文案改富文本：site-content 新增 renderRich(md,{inline})
  复用既有全管线（raw→内容净化→class 白名单→链接卡片）；接入
  home.tagline/subtitle、opensource.blurb、about.intro、blocks prose；
  新增 .rich 容器作用域并与 .prose-body 合并（77 处选择器覆盖四类容器）
  坑：renderRich 输出 <p> 塞进 <p class="tagline"> 会被浏览器拆散 →
  行内场景用 {inline:true} 剥外层 <p>
- 层 2 页面级排版覆盖：三单例加 typography{font?,accent?,scale?}，读取器
  pageTypography() 走白名单（10 字族 / 18 色类，scale 夹 0.8–1.25，清单外
  忽略）；页面容器挂 .page-typo + CSS 变量 --page-font/--page-accent/
  --page-scale，不动全站 tokens；后台三页加「页面排版覆盖」下拉
- 层 3 艺术字体：新增 font-art-kuaile（快乐体专用类，字距微调），白名单与
  可视化面板同步；站酷高端黑/阿里妈妈东方大楷/演示悠然小楷因无 npm 包或
  嵌入条款风险进候补清单
- 默认值清理：about.yaml 的 typography 测试值（整页汇文）清为注释示例——
  整页换字族会带来 694KB 字体成本，默认留空=全站默认排版

验证: 构建 48 页 exit 0；E2E 37/37；三页 page-typo 挂载与变量实测、四页
      （图库/书架/文章/装备）隔离为 0、font-art-kuaile 生效、about 清空后
      无覆盖

Spec: none (排版三层，先于 5g 的任务；T3/T4 另行交付)

Co-authored-by: GLM-5.3
 2026-11-02 18:40:32 +08:00
wait4xandGLM-5.3 3822e150a8 feat(typography): 首批 6 字族落地（新增汇文明朝/站酷快乐）+ 13 款候补清单 
- 新增两款自托管字族：font-huiwen（汇文明朝体，文风开源 cn-font-split
  339 片切片包，用到页 +535KB、按需拉取实测 19/339 片）｜font-kuaile
  （站酷快乐体 +163KB）——补齐「宋明气质」与「轻松标题」两个字体缺口
- 首批 6 族全部 OFL-1.1 且允许 web 嵌入；未用字体的页面增量恒 +0.0KB
  （按页子集化生效）
- 候补 13 款逐款标注「许可证 + web 嵌入」：HarmonyOS Sans/MiSans/OPPO
  Sans/阿里普惠体（免费商用 + 明确允许嵌入，但 npm 无包/整包过大）、
  得意黑/更纱/站酷高端黑/花园明朝（OFL 但无可用 npm 分发）、霞鹜文楷
  Light（+8605KB 否决）、演示悠然小楷（"个人免费"常禁 @font-face，风险）
- docs 写入「加字四步流程」（核双授权 → 装包或放 public/fonts → 加类+
  白名单+面板项 → 跑体积账）
- 可视化面板 35 项（10 字族 + 25 颜色）；白名单放行 10 字族类
- 资产：public/fonts/hwmc（339 woff2 13MB + fonts.css 162KB）入仓

车道：op-artalk；收编复验：构建 48 页、E2E 37/37、两款新字体 computed
与切片按需加载实测（hwmc/27、52 等 20 个请求）

验证: pnpm astro build 48 页 exit 0；E2E 37/37；playwright 新字体 computed
      + 字体请求观测

Spec: none (字体扩展，车道级交付)

Co-authored-by: GLM-5.3
 2026-11-02 17:47:13 +08:00
wait4xandGLM-5.3 26bbb66a72 feat(typography): 16 类语义色板（8 色相×2 档）+ 字体回退升级 + 面板 v2 
- 颜色：c-{blue,teal,green,yellow,orange,red,pink,purple} × {标准,soft}
  共 16 类；tokens 明暗各一套值，32 项浏览器实测对比度 4.50–11.73（零失败）；
  黄色压到 #7a5900（原色白底仅 ~1.8:1）、黄/粉 soft 压深留余量
- 使用纪律入档：彩色只作用于正文强调，站点外壳（导航/页脚/按钮/背景/边框）
  保持灰阶，单页彩色强调建议 ≤3 处
- 字体：3/4 回退类升级为「自托管优先 + 系统兜底」（font-song→Noto Serif SC、
  font-kai-sys→霞鹜文楷、font-hei-sys→Noto Sans SC，+0.0KB 跨设备一致）；
  仿宋无 OFL 自托管包（fandol/朱雀仿宋均无版本）→ 纯系统回退，缺口待决策
- webfont 候选全部按体积账否决并留档：霞鹜文楷 Light 用到页 +8605KB、站酷小薇
  +648KB、得意黑/更纱/汇文无可用 npm 包；根因=@fontsource CJK 切片粒度
- 可视化面板 v2：33 项（8 字族 + 25 颜色），颜色项带 16px 色块预览、字体项带
  示例字形「秋海」并标注自托管/优先/系统；桩 CMS 7 项验证全过
- 白名单放行 25 色类 + 8 字族类；docs 三表（灰阶层级/语义色板含对比度/字体
  含许可证与体积账）更新

车道：op-artalk（改口径后重跑，实测表齐全）；收编复验：CSS 16 色类定义与
白名单一致、暗态值在 [data-theme="dark"] 段、字体回退类 computed 生效、
构建 48 页、E2E 37/37

验证: pnpm astro build 48 页 exit 0；E2E 37/37；playwright 抽查彩色类与
      字体回退 computed

Spec: none (排版色板与字体回退，车道级交付)

Co-authored-by: GLM-5.3
 2026-11-02 17:14:12 +08:00
wait4xandGLM-5.3 2cab243891 feat(typography): 可视化排版选择器（Sveltia inline 组件）+ 颜色扩充 + 方案 10 
- 可视化选择（核心痛点解决）：Sveltia 原生支持 registerEditorComponent
  的 inline 形态且 onInsert 能拿到 selectedText → 实现「选中文字 → Insert ▸
  排版 → 选字体/颜色 → 自动包 span class」完整链路；因 inline 组件只能进
  Insert 菜单（field-based 虽可上工具栏但拿不到 selectedText），两个独立组件
  会互相抢 pattern 匹配，故收敛为单入口 + 18 项分组面板（键盘可达/Esc 取消/
  onEdit 回填当前类）
- public/admin/typography-classes.js 为单一事实源（扩展与文档共用）
- 颜色扩充 4 类：ink-warm / ink-cool / ink-faint / ink-accent-soft，全部亮暗
  双态实测 ≥4.5:1（ink-faint 取白底达标的最淡值 4.69/4.75）
- 字体：体积账否决 webfont 新增（@fontsource zcool-xiaowei 用到即 +647.7KB，
  远超 150KB 阈值；smiley-sans 无可用版本、sarasa 包为空壳），改为落地 4 个
  **系统回退类**（font-song/font-kai-sys/font-hei-sys/font-fangsong，零下载，
  文档注明依赖访客设备）
- 白名单 17 类同步；docs/写作指南.md 三表更新
- docs/research/10-页面后台化方案.md：五方案对比 + 推荐方案 E（页面骨架 blocks
  / 区块字段 / 局部自由区 / 样式即数据四层）+ 关于页九类区块 + 消毒与验收断言
  + 分阶段清单（约 7.2d）

验证: 16/16 颜色 computed 与对比度实测；选择器 7/7（桩 CMS 覆盖注册/插入/
      编辑三层）；构建 48 页 exit 0；E2E 37/37

Spec: none (排版能力 + 方案文档)

Co-authored-by: GLM-5.3
 2026-11-02 16:57:54 +08:00
wait4xandGLM-5.3 280654f9e3 feat(reader): PDF 改 pdf.js 渲染+斜体 bug 根治+评论假挂载修复+排版类 
【T1 PDF 内置阅读重做】iframe 对 arXiv PDF 实测 ERR_ABORTED（浏览器 PDF
插件策略差异）→ pdfjs-dist 6.4.299 客户端 canvas 渲染：只在 /papers/
动态 import（worker ?url 打包，不进全站 bundle）；文档一次取回 + IO
懒渲染（rootMargin 400px）+ 页占位 aspect-ratio 防跳动 + 12s 首屏兜底 +
微信 UA 直接兜底；工具条页码/缩放/翻页/下载/arXiv/授权声明保留。红线：
PDF 由访客浏览器直取 arXiv（CORS * 实测），仓内零副本。真页实测：
13 页 canvas 全绘制、首屏墨迹像素非空、零 console 错误。

【T2 斜体排版 bug 真凶】global.css 的 `.prose-* p > em:only-child
{ display:block; text-align:center }` 图注样式按"斜体独占段"自动命中，
把所有正文独占段斜体变成块级居中。改：图注用显式 .fig-cap 驱动 + 补
em/i { display:inline; font-style:italic } 基线；media-sample 迁移新写法，
指南注明旧写法失效原因。实测独占段与行内斜体均 display:inline/italic。

【T3 评论"假挂载"真 bug】原 initArtalk 一进来就置 mounted=true——脚本
404/被拦截时把空容器误标已挂载，5s 兜底被绕过，正是"评论区一直空着"的
来源之一。改为库就绪才算成功；另加三触发路径（IO 主 + 锚点点击 + 滚到
页底 2s 兜底）、5s 失败提示+重试钮、软导航重挂、成功打
data-artalk-mounted=1 供 E2E。

【T4 文章排版类 + 安全白名单】11 个受限类（ink-1/2/3/muted/accent、
font-serif/kai/sans/mono、drop-cap、quote-line、fig-cap）全走 tokens 禁
任意 hex；新增 rehype-class-whitelist.ts：className 白名单 + 剥离 style
与 on*；实测注入用例只剩 class="ink-2"，style/onclick 全无。新坑入档：
markdown raw HTML 在 hast 是 type:'raw' 节点、白名单插件看不见 span，必须
先 rehype-raw 再过滤 → 插件链 [rehypeRaw, rehypeClassWhitelist,
rehypeLinkCards]。新依赖：pdfjs-dist、rehype-raw。

车道：op-artalk（T1 6/6、T2 2/2、T3 3/3、T4 6/6）；收编复验：build 46 页、
E2E 37/37、四专项 playwright 实测（PDF 13 canvas/斜体 inline/白名单净化/
评论 mounted 标记）

验证: node v26.13.0 + astro 7.4.4 构建 46 页 exit 0；E2E 37/37 PASS

Spec: none (阅读体验四件，车道级交付)

Co-authored-by: GLM-5.3
 2026-11-02 15:59:28 +08:00
wait4xandGLM-5.3 8ec1712135 feat(5f): reader 模式+版式基底+首屏 tagline+图库质感（T4/T7/T8） 
- T4 reader：html.reader 单 class（去装饰非去内容：隐辉光/图标
  钮/pv 行，ICP 合规底线永留；正文字号+1px 行宽 56ch；入场动效
  关）；命令面板 reader 命令+r 键+localStorage；ThemeScript 预绘
  防闪
- T7 基底：--flow-* 五流距变量双轨应用；暗色 hairline 降档；
  页面标题 700→600（裁定 #6 减字重不减号）；focus-visible ring
  统一；列表行距 +2px；--paper/--radius-img/--ease-out 入库
- T8：首页 IdCard slot 落 tagline「写作者 · 读者 · 快门按压者，
  拥抱开源。」；图库暗色 4% 轻衬底+圆角统一（裁定 #4 双模式分判）

验证: E2E 33/33；reader r 键触发+辉光 none+刷新保持实测；流距
      computed 0.6em 实算；tagline 渲染实测

Spec: 2026-10-26_blog-5f

Co-authored-by: GLM-5.3
 2026-11-01 09:09:27 +08:00
wait4xandGLM-5.3 363cc616f7 feat(motion): 动效层三件——背景辉光/入场/心跳，页脚撤双入口 
- 背景鼠标辉光：ink 色 4% 径向渐变跟随（pointer:fine×非
  reduced-motion 才有 JS，raf 节流 document 级监听 VT 存活）——
  丙灰阶语言的"活背景"，触屏/减动效自动隐藏
- 正文入场 rise-in 12px/0.4s（VT 换页自然重放）+ 列表行悬停
  1px 微浮；全量 prefers-reduced-motion 豁免
- 首页"最近心跳"：构建期拉 blog 仓最新 commit（gitea API 8s 超时
  静默降级），脉冲点+相对时长——本站自己的脉搏
- 页脚撤「装备/制作」入口（页面保留，用户决策：只删入口）
- E2E 加固：g-chords 修好后 location.href 与 goto 竞态（en 页弦
  导航迟到提交打断 goto）——中断重试模式
- 过程教训：str.replace 静默无操作再犯（锚点瞄错组件文件）——
  脚本未进产物却报"全落地"，replace 必须 assert 配对 grep 产物

验证: --mx 鼠标双跳 15.6% 实测跟随；E2E 31/31 PASS（竞态重试后
      确定性）；构建 34 页 exit 0

Spec: none (动效层+页脚撤口+测试加固，车道级交付)

Co-authored-by: GLM-5.3
 2026-10-25 22:09:41 +08:00
wait4xandGLM-5.3 2802278be6 fix(mobile): 移动端全站横向溢出修复——Header 三档断点与长词断行 
- B1（移动审计 blocker）：Header 7 项一行在 390px 溢出 51-88px（主题钮
  被推出屏、整页可晃——用户实测报告的"布局存在问题"实锤）→ 430px
  断点收紧（字号/边距/间隙/图标钮 32px）+ 370px 末档（en Open Source
  长词）
- M1：.prose-tech 补 overflow-wrap:break-word（裸长 URL 曾撑破 88px，
  只给了书评轨是漏）
- m1：ProjectWall 标题 i18n（en 页曾硬编码中文）+ locale prop
- m3：列表标题两行钳制（en 长标题截断丢信息）；m4：页脚/pn/书架
  触控目标 ≥24px
- 已知边界：320px 超窄屏 en 仍溢 23px（超出现实机型范围，记录不改）

验证: 移动溢出回归 390/360 × 12 页全过（scrollWidth 断言，曾全站
      51-118px）；E2E 30/30 PASS；技术文长 URL 页 +88→0

Spec: 2026-10-25_add-blog-5c

Co-authored-by: GLM-5.3
 2026-10-25 19:46:06 +08:00
wait4xandGLM-5.3 19ffcf180b feat(media): 灯箱动作胶囊化与正文三媒样式段（T1/T3） 
- 原图/下载：裸链 → 与 lbnav 同语言的胶囊按钮（图标+文字+暗底描边）
- global.css 媒体段：正文 img 圆角限宽、*斜体独立段*图注约定、
  video/audio 全宽样式（raw HTML 直书方案，指南随后）

验证: pnpm astro build 21 页 exit 0

Spec: 2026-10-25_add-media-and-polish

Co-authored-by: GLM-5.3
 2026-10-25 11:45:06 +08:00
wait4xandGLM-5.3 7a2880b65d fix(polish): 上线四缺陷修复——明暗委托/灯箱常开/评论站点名/书评宋体 
- 明暗切换：document 级委托（软导航换 DOM 后元素级监听全丢）；
  E2E 再抓一坑：SVGElement 非 HTMLElement 实例，守卫用 Element 基类
- 图库：#lb 无条件 display:flex 覆盖 UA 隐藏 → 灯箱"永远打开"盖全页；
  改 #lb:not([open]) 显式 none；时间戳标题清空；灯箱打磨（切换钮
  实底阴影/n/21 计数器/空标题隐藏/原图链接暗底亮蓝）
- 评论：site 'wait4x'→'wait4x.online' 对齐 Artalk 服务端（404 根因）
- 书评字体：文楷→思源宋（@fontsource 预分片）；文楷降级金句 --font-kai
- 数据：21 张照片组修正 street→landscape（迁移器收到内部组 id 的坑）
- 新增 tests/e2e.mjs：Playwright 30 项全功能 E2E

验证: node tests/e2e.mjs 30/30 PASS（含软导航后明暗切换回归项）

Spec: 2026-10-25_fix-site-polish

Co-authored-by: GLM-5.3
 2026-10-25 10:46:03 +08:00
wait4xandGLM-5.3 945a9ee610 feat(pages): 五页型落地——首页/文章双模板/图库 masonry/瞬间/关于 
- 首页：名片+身份陈述空槽+按年分组分轨列表（情绪色/mono标签）+影像格+项目墙
- 文章 /archives/{slug}（与 Halo 旧 URL 1:1）：reading→衬线纸墨 / tech→
  TOC 侧栏(≥1120 sticky)+2px 进度条+Artalk 容器占位
- 图库：grid masonry（构建期 aspect-ratio 零 JS）+原生 dialog lightbox
  （←→/Esc+EXIF 底栏）+分组筛选
- 瞬间时间线 / 关于（三轨版图+构建说明）
- sharp ^0.35.5 入依赖（Astro 7 不内置，astro:assets 缩略图管线前提）
- 裸 blockquote 默认吃 A 墨线样式（markdown 原生输出无类名的缝隙）
- 车道 30min 超时，产物完整，主会话补 sharp+断言脚本递归修正后收编

验证: pnpm astro build exit 0（7 页）；五路由产物断言过；
      scripts/check-responsive.sh 11/11 ok（1120/820/760/560 全档）

Spec: 2026-10-24_add-blog-skeleton
Co-authored-by: GLM-5.3
 2026-10-25 00:11:34 +08:00
wait4xandGLM-5.3 4cb1c85cc3 feat(design): 设计 tokens 与全局样式——丙路线「灰阶骨架×分轨正文」 
- tokens.css：四档灰阶/单强调蓝/蓝黑暗色/纸墨面板/情绪色五档/
  字体三轨栈/排版三角(书评20-1.75-720 技术19-1.7)/唯一缓动曲线
- global.css：轻量reset/双轨正文(.prose-reading/.prose-tech)/
  引文A墨线+D金句62px水印/终端风代码块/::selection半透明/
  560px降档18px/动效总闸prefers-reduced-motion

验证: pnpm astro build exit 0；参数与调研报告 §3 一一对应

Spec: 2026-10-24_add-blog-skeleton
Co-authored-by: GLM-5.3
 2026-10-24 23:07:11 +08:00