wait4x/blog
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
229 Commits 5 Branches 0 Tags
f581f5bc4f2cdbad0e198565cf8c35955f5951ab
Commit Graph
5 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 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