用户拍板「字族扩展都补」。六款按三类各两款落地,全部单页增量 ≤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
58 lines
4.4 KiB
JavaScript
58 lines
4.4 KiB
JavaScript
/**
|
||
* 排版类清单 —— 单一事实源(后台编辑器面板与文档共用)。
|
||
* 与 src/styles/global.css 的「受限排版类/语义色板」段、src/lib/rehype-class-whitelist.ts 的白名单三处保持一致:
|
||
* 加类时三处同改,否则构建期白名单会把新类剥掉。
|
||
*
|
||
* swatch / family 仅供**后台面板预览**使用(后台无站点 CSS 变量,故给具体值):
|
||
* swatch 取亮态值(后台是浅色 UI),family 为该类的真实字体栈。
|
||
*/
|
||
window.TYPOGRAPHY_CLASSES = {
|
||
font: [
|
||
{ cls: 'font-serif', label: '思源宋(书评正文)', family: '"Noto Serif SC", Georgia, serif', kind: '自托管' },
|
||
{ cls: 'font-kai', label: '霞鹜文楷(金句)', family: '"LXGW WenKai Screen", "Songti SC", serif', kind: '自托管' },
|
||
{ cls: 'font-sans', label: '思源黑(UI/技术)', family: '"Noto Sans SC", system-ui, sans-serif', kind: '自托管' },
|
||
{ cls: 'font-mono', label: 'JetBrains Mono(等宽)', family: '"JetBrains Mono", ui-monospace, monospace', kind: '自托管' },
|
||
{ cls: 'font-song', label: '宋体族', family: '"Noto Serif SC", "Songti SC", SimSun, serif', kind: '自托管优先' },
|
||
{ cls: 'font-kai-sys', label: '楷体族', family: '"LXGW WenKai Screen", "Kaiti SC", STKaiti, serif', kind: '自托管优先' },
|
||
{ cls: 'font-hei-sys', label: '黑体族', family: '"Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif', kind: '自托管优先' },
|
||
{ cls: 'font-fangsong', label: '仿宋族', family: 'FangSong, STFangsong, serif', kind: '系统回退' },
|
||
{ cls: 'font-huiwen', label: '汇文明朝体', family: '"WF-Hwmc", serif', kind: '自托管' },
|
||
{ cls: 'font-kuaile', label: '站酷快乐体', family: '"ZCOOL KuaiLe", serif', kind: '自托管' },
|
||
{ cls: 'font-art-kuaile', label: '快乐体(艺术·仅标题)', family: '"ZCOOL KuaiLe", serif', kind: '艺术字' },
|
||
// 5i T9 五款字族扩展(2026-11-03,均 OFL / 免费商用且允许 web 嵌入)
|
||
{ cls: 'font-xiaowei', label: '站酷小薇(文学·宋)', family: '"ZCOOL XiaoWei", serif', kind: '自托管' },
|
||
{ cls: 'font-huangyou', label: '站酷庆科黄油(标题)', family: '"ZCOOL QingKe HuangYou", sans-serif', kind: '自托管' },
|
||
{ cls: 'font-mashanzheng', label: '马善政(书法)', family: '"Ma Shan Zheng", "Kaiti SC", serif', kind: '自托管' },
|
||
{ cls: 'font-liujianmaocao', label: '柳建毛草(草书)', family: '"Liu Jian Mao Cao", "Kaiti SC", cursive', kind: '自托管' },
|
||
{ cls: 'font-smiley', label: '得意黑(斜体标题)', family: '"Smiley Sans", sans-serif', kind: '自托管' },
|
||
{ cls: 'font-neoxihei', label: '霞鹜新晰黑(正文黑)', family: '"LXGW Neo XiHei", "Noto Sans SC", sans-serif', kind: '自托管' },
|
||
],
|
||
color: [
|
||
{ cls: 'ink-1', label: '最重(标题级)', swatch: '#111113' },
|
||
{ cls: 'ink-2', label: '正文', swatch: '#33343a' },
|
||
{ cls: 'ink-3', label: '次要(日期/元信息)', swatch: '#6b6e78' },
|
||
{ cls: 'ink-muted', label: '最淡(注释感)', swatch: '#70747c' },
|
||
{ cls: 'ink-warm', label: '暖调正文', swatch: '#3f362e' },
|
||
{ cls: 'ink-cool', label: '冷调正文', swatch: '#2f3742' },
|
||
{ cls: 'ink-faint', label: '最淡可读档', swatch: '#70747c' },
|
||
{ cls: 'ink-accent', label: '强调(链接色)', swatch: '#3454d1' },
|
||
{ cls: 'ink-accent-soft', label: '弱强调', swatch: '#4f66c2' },
|
||
{ cls: 'c-blue', label: '蓝', swatch: '#2456c9' },
|
||
{ cls: 'c-blue-soft', label: '蓝(soft)', swatch: '#4170dd' },
|
||
{ cls: 'c-teal', label: '青', swatch: '#0d7d74' },
|
||
{ cls: 'c-teal-soft', label: '青(soft)', swatch: '#0e847a' },
|
||
{ cls: 'c-green', label: '绿', swatch: '#1f7a3a' },
|
||
{ cls: 'c-green-soft', label: '绿(soft)', swatch: '#22853f' },
|
||
{ cls: 'c-yellow', label: '黄(已压暗)', swatch: '#7a5900' },
|
||
{ cls: 'c-yellow-soft', label: '黄(soft)', swatch: '#926a00' },
|
||
{ cls: 'c-orange', label: '橙', swatch: '#9a4a00' },
|
||
{ cls: 'c-orange-soft', label: '橙(soft)', swatch: '#ba5900' },
|
||
{ cls: 'c-red', label: '红', swatch: '#b32020' },
|
||
{ cls: 'c-red-soft', label: '红(soft)', swatch: '#db3737' },
|
||
{ cls: 'c-pink', label: '粉', swatch: '#a3246a' },
|
||
{ cls: 'c-pink-soft', label: '粉(soft)', swatch: '#ce3386' },
|
||
{ cls: 'c-purple', label: '紫', swatch: '#6a35b8' },
|
||
{ cls: 'c-purple-soft', label: '紫(soft)', swatch: '#8c5ed1' },
|
||
],
|
||
};
|