头像和字体(dsh-avatar-font)
给 DSH 会话双方各配一张头像,消息左右分列(像好友聊天);同时可以换界面字体与代码字体、 调正文与标题字号、行距、加粗和字色。两个功能各自独立启停,关掉其中一个不影响另一个。
从 壁纸引擎插件(dsh-plugin-wallpaper-engine) 的头像扩展与 dsh-fonttune 的字体功能移植而来, 只保留这两件事 —— 不带壁纸、液态玻璃、点击特效、拖尾、吉祥物。
仓库地址:https://github.com/lerwa2025-a11y/dsh-avatar-font 原作者:elysia395(https://github.com/elysia395/dsh-wallpaper-engine),MIT 协议,特此致谢。
v2.0 更名说明:本插件原叫
dsh-conversation-avatar(头像和气泡框)。 「AI 回复气泡框」整套功能已按用户要求移除,插件更名为dsh-avatar-font。 旧包已标记弃用(deprecated),旧仓库已归档。设置与头像数据会自动迁移,无需手动处理。
安装
方式一:让 DSH 从本机文件夹加载(推荐,改代码即时生效)
在 DSH 界面里:插件 → 添加插件 → 选择"从本地/文件夹安装",指向本文件夹即可。 安装后重启 DSH。
或在命令行执行(desktop 换成你自己的 profile 名):
dsh plugin --profile desktop add "本地文件夹的绝对路径"
方式二:从 npm 安装(最省事,不用克隆仓库)
dsh plugin --profile desktop add dsh-avatar-font
或打包下载:
npm pack dsh-avatar-font
安装后重启 DSH。
方式三:从 GitHub 直接安装
在 DSH 界面里:插件 → 添加插件,填入下面这个地址即可:
https://github.com/lerwa2025-a11y/dsh-avatar-font
因为仓库是公开的,DSH 会自动拉取源码装上。安装后重启 DSH。
注意:仓库必须公开才能这么装;私有仓库需要先在另一台电脑上登录 GitHub 账号。
方式四:打包成压缩包给别人
把本文件夹打包成 ZIP 发给对方,对方在 DSH 界面里用「导入」功能选择该 ZIP 即可。 导入后同样需要重启 DSH。
安装后
- 重启 DSH
- 打开 设置 → 插件 → 已安装 → 点开「头像和字体」
- 想用头像就上传图片、调大小和圆角;想改字体就换字体、调字号
- 两个功能顶部的开关默认都开着,不需要哪个就单独关掉
注意:头像图片和设置存在 $DSH_HOME 下(见「存储」),不随插件代码走。
换电脑安装后需要重新上传头像;或把旧机器上的整个数据目录拷到新机器的同一位置。
卸载
在 插件 页面里停用或删除本插件,重启 DSH。 停用后会移除界面上全部头像与字体覆盖,但你上传的图片和设置会保留。
功能
头像
- 每个消息行都配头像:user / steering 行在右侧,assistant-step 行在左侧。 (与壁纸引擎一致;展开「已完成,用时…」过程区时里面的行也会各配一张。)
- 跟随滚动:长回复往下滚时,头像贴着滚动区顶部跟着走;整条消息滚出去才随行消失。 可关:关掉后头像只固定在消息开头,往下翻时随行一起滚走,不跟着滑动。
- 吸顶下移:翻页时头像下滑 N 个身位(默认 2),避开主题插件云母状态栏的遮挡。 跟随关掉时此项置灰不可调。
- 内置默认头像:没导入图片时画 SVG(我方人像、助手四角星),跟随主题文字色。
- 独立开关:关掉「头像」后,注入的头像节点、行标记、尺寸变量全部还原, 消息按原生排版显示;字体设置照常生效。
字体
- 界面字体:微软雅黑 / Noto Sans SC / 宋体 / 黑体 / 楷体 / 仿宋
- 正文字体:覆盖界面字体,只作用于正文
- 代码字体:Consolas / JetBrains Mono / 系统等宽
- 正文字号:−4…+8 px,相对主题,0 = 不变
- 标题字号:−6…+12 px,独立于正文
- 行距:−20…+60 %,相对主题
- 正文加粗:0 = 跟随主题;只加粗段落,不动标题层次
- 正文字色 / 我的消息字色:留空 = 跟随主题,两边可分别设成不同颜色
- 独立开关:关掉「字体」后字体样式节点被移除、字色变量被撤掉, 界面回到主题默认;头像照常显示。
设置
入口:设置 → 插件 → 已安装 → 点开「头像和字体」这个插件,
设置卡片就在它详情页的「描述」和「组件列表」之间(槽位 plugins.bundle.config,按包名 keyed)。
面板分成两块卡片:头像 和 字体,各带一个开关。开关关掉时, 它下面那一组控件会整组隐藏 —— 不显示调了也不会生效的东西。
| 分组 | 项 | 说明 |
|---|---|---|
| 头像 | 头像 | 开关,默认开。关掉后消息按原生排版显示 |
| 头像 | AI 头像 / 我的头像 | 上传、替换、清除(图片自动缩到 512px 内,存本机) |
| 头像 | 头像大小 | 16–128 px |
| 头像 | 圆角强度 | 0(直角)–100(正圆)% |
| 头像 | 跟随画面 | 开关,默认开。关掉后头像只固定在消息开头,不跟着滑动 |
| 头像 | 吸顶下移 | 0–6 个头像身位,默认 2。跟随关掉时置灰 |
| 字体 | 字体 | 开关,默认开。关掉后回到主题默认外观 |
| 字体 | 界面字体 | 整站生效(含侧边栏标题) |
| 字体 | 正文字体 | 覆盖界面字体,只作用于正文 |
| 字体 | 代码字体 | 只影响代码块与行内代码 |
| 字体 | 正文字号 | −4…+8 px,0 = 不变 |
| 字体 | 标题字号 | −6…+12 px,独立于正文 |
| 字体 | 行距 | −20…+60 %,0 = 不变 |
| 字体 | 正文加粗 | 0 = 跟随主题;只加粗段落,不动标题层次 |
| 字体 | 正文字色 | 留空 = 跟随主题。只改 AI 回复的正文,代码/思考/工具调用不变 |
| 字体 | 我的消息字色 | 留空 = 跟随主题。只改你自己发出的消息文本 |
没有「启用插件」总开关:插件的启停本来就归 DSH 的「插件管理」, 面板里再放一个只会变成第二个真相源(关掉它并不会卸载插件),容易让人误解。已去掉。
两个字色互不干扰
「正文字色」和「我的消息字色」是两个独立的变量:
| 设置项 | CSS 变量 | 作用行 |
|---|---|---|
| 正文字色 | --cav-text-color |
[data-chat-flow-kind="assistant-step"] |
| 我的消息字色 | --cav-user-text-color |
[data-chat-flow-kind="user"] / "steering" |
可以分别设成不同颜色,也可以只设一边。都不设 = 完全跟随主题。
v2.0 改:这两条规则原来挂在插件自己打的
[data-cav-row]标记上。 那个标记只有「头像」开着时才存在,而字色现在归「字体」管 —— 继续用它会导致「关头像、留字体」时字色莫名失效。 所以改用宿主原生的data-chat-flow-kind,它是宿主自己写在行上的,永远在。
正文字色管到哪儿、不管哪儿
管:AI 回复里的段落、标题、列表、粗体、斜体 —— 所有靠继承取颜色的文字。
不管(有意排除,不是遗漏):
| 排除对象 | 为什么 |
|---|---|
代码块 pre / 行内 code |
宿主用 shiki 做语法高亮,每个 token 自带颜色。底色和默认前景若被用户色污染,深色代码块上会出现看不清的暗字 |
思考区 [data-chat-group-part="reasoning"] |
与头像的判定同一套标记(isProcessRow),两处必须一致 |
工具调用 [data-chat-flow-kind="turn-process"]、[data-chat-call-id] |
工具卡片有自己的状态色,改字色会让「红=错误」这类约定失效 |
头像自身及其后代 .cav-avatar, .cav-avatar * |
头像 SVG 用 stroke="currentColor",被染色后会连带影响观感(2026-10-25 事故) |
实现上不是逐元素点 color,而是把用户色下发到整棵子树
(*:not(排除清单)):宿主的正文容器 AssistantMarkdown 自己在根节点上写死了
color: var(--dsw-alias-label-primary),这是显式声明、会截断继承 ——
只设在外层父元素上传不进去。
变量由 JS 写入 <body>,留空就移除变量、整条规则失效。
这样不会像 * { color } 那样连图标、边框、按钮一起改。
不做对比度校验:选什么颜色是用户的选择,面板只提示一句当前状态。
字体结构:界面 + 正文覆盖
正文字体(bodyFont) ← 覆盖层:不填就跟随界面字体
↑ 覆盖
界面字体(fontFamily) ← 打底,整站生效(含侧边栏标题)
| 界面 | 正文 | 结果 |
|---|---|---|
| 雅黑 | 空 | 整站雅黑 |
| 雅黑 | 宋体 | 正文宋体,其余(含侧边栏标题)仍是雅黑 |
为什么没有「标题字体」这一项:
查 app.asar 逐条核对,三条链路最终取的是同一个 --dsw-font-family:
| 位置 | font-family 来源 |
|---|---|
| markdown 正文 | var(--dsw-font-family) |
| markdown 标题 h1–h6 | var(--dsw-font-family) |
| 侧边栏标题 | 无自己的声明,继承 body → 也是 --dsw-font-family |
所以「标题字体」和「界面字体」是同一个变量。再做一个开关不会有任何区别于界面字体的
效果,等于把同一件事卖两次 —— 故去掉。代码里 headingFont 字段仍保留(老配置读进来
不会报错),万一以后 DSH 拆出独立标题令牌可以直接用上。
实现要点:
- 正文不穷举标签(
p/li/td会漏),而是给 markdown 容器设字体, 让内部所有元素继承 —— 这样任何层级都吃到正文字体。 - 正文规则需要
!important:容器自身有font:var(--dsw-font-markdown-base)简写, 里面已含 family,不加 flag 压不过去。 - 用户消息不是 markdown 渲染,所以正文字体会额外覆盖到你自己的消息
(限定
[data-chat-flow-kind="user"|"steering"],不误伤别处)。 - 覆盖层规则不加
!important到父容器:子元素自身声明本就优先于body的继承值。
字号为什么能分开调
查 app.asar 得到 DSH 的体系:
正文 --dsw-font-markdown-base = var(--dsh-content-font-size, 14px) / ...
标题 --dsw-font-markdown-h1..h3 = calc(N px + var(--dsh-content-font-delta))
正文挂在 --dsh-content-font-size,标题挂在 --dsh-content-font-delta。
两个变量天生不同,所以「正文 +2px、标题 −3px」这种组合可以直接生效,互不影响。
字体清单只列本机装了的:dsh-fonttune 原版清单有 22 项,含 PingFang SC、 Sarasa Gothic、Hiragino 等 macOS/第三方字体。本机没有的字体选中后会静默回退, 看起来像「功能没生效」。这里只列实测安装过的 6 种中文字体,每项都带 generic family 兜底。
必须 !important:DSH 主题把 --dsh-content-font-size 内联写在 body 上,
内联声明优先级高于普通样式表规则,不加 !important 完全改不动。
字体值做了注入过滤:这个值会被拼进 CSS,所以只放行字母数字、空格、中文、
连字符、下划线、引号、逗号;; { } ( ) 一律拒绝,防止逃出声明边界。
v2.0 移除气泡框时一并删掉的东西
气泡框不只是一层视觉。它下面挂着几条「防内容溢出」的兜底规则, 按用户要求「就要最干净」,这些全部删掉,没有保留行级替代品:
| 删掉的规则 | 原来解决什么 |
|---|---|
.cav-bubbled :where(.md-table-wide) 归位 |
宿主给宽表格加的 .md-table-wide 故意比正文更宽,会把气泡撑破 |
.cav-bubbled > * { max-width:100%; min-width:0 } |
通用兜底,防任何直接子元素撑破容器 |
.cav-bubbled :where(pre, table, ...) { overflow-x:auto } |
长代码块 / 长 URL / 公式在自己内部横向滚 |
.cav-bubbled :where(img, video, ...) { max-width:100% } |
媒体等比缩小 |
.cav-bubbled { overflow-wrap:anywhere } |
长 URL 强制断行 |
已知后果:宽表格、长代码行、超长 URL 现在会重新横向溢出正文区。 这是「去掉气泡框」的必然代价 —— 那些约束本来就是为气泡服务的, 没有气泡就无处安放。如果以后需要,应该做成独立功能,不要挂在头像上。
存储
$DSH_HOME/dsh-avatar-font/
├── settings.json
└── avatars/
├── user-<stamp>.<ext>
└── ai-<stamp>.<ext>
从旧版升级:把
$DSH_HOME/dsh-conversation-avatar/整个目录改名为$DSH_HOME/dsh-avatar-font/即可,settings.json里的aiBubble/bubble*键会被静默丢弃,其余设置(含头像尺寸、圆角、 跟随开关、字体设置)原样保留。
路由
GET /dsh-avatar-font/avatar/<side>→ 头像字节(未导入 404)POST /dsh-avatar-font/avatar/<side>→ 导入DELETE /dsh-avatar-font/avatar/<side>→ 清除GET/POST /dsh-avatar-font/settings→ 读写设置
移植说明
装饰层逻辑(行选择器、注入标记、MutationObserver 早退、就地更新)取自壁纸引擎的
src/avatar-layer.js;默认头像 SVG 零件表取自同处。类名统一改为 cav-* 前缀,
数据目录与设置独立,避免与壁纸引擎冲突。
注意:不要同时启用本插件与壁纸引擎的「自定义会话头像」——两者都会往同一批
[data-chat-flow-kind] 行里插头像,会出现双重头像。
更新日志
| 版本 | 改了什么 |
|---|---|
| 2.0.0 | 更名 dsh-avatar-font(头像和字体)。移除「AI 回复气泡框」整套功能(含为它服务的全部超宽内容约束)。新增「头像」「字体」两个独立开关,可单独启停。去掉「启用插件」总开关(插件启停归插件管理)。字色改挂宿主原生 data-chat-flow-kind,与头像层彻底解耦 |
| 1.0.0 | 「头像跟随画面」开关:可以关掉,关掉后头像只固定在消息开头、不跟着滑动(默认仍跟随)。跟随关闭时「吸顶下移」置灰 |
| 0.3.3 | 修气泡包不住宽内容(宽表格改为表格自己横向滚,不再冲出气泡) |
| 0.3.2 | 去掉「标题字体」(侧边栏标题就是界面字体,留着是误导),正文字体成为界面字体的覆盖层 |
| 0.3.1 | 正文字体覆盖层;字色扩展到用户消息 |
| 0.3.0 | 字体功能:界面字体 / 代码字体 / 正文字号 / 标题字号 / 行距 / 加粗(移植自 dsh-fonttune 的精简版) |
| 0.2.5 | 用户消息字色,与 AI 正文字色互不干扰 |
| 0.2.2 | AI 正文字色(只作用于正文,代码 / 思考 / 工具调用不变) |
| 0.2.1 | 修「拉高气泡不透明度后看不见字」(isolation + z-index:-1);气泡磨砂 |
| 0.2.0 | 设置从「设置页独立一节」搬到插件自己的详情页 |
| 0.1.x | 会话头像 + AI 气泡框首版(移植自壁纸引擎的头像扩展) |
No comments yet. Be the first to write one.