dsh-theme-holo

dsh-theme-holo

《狼与香辛料》赫萝主题 —— 给 DeepSeek Harness Web GUI 的一层暖纸皮肤。

羊皮纸底色、麦金强调色、一段 12 秒实时渲染的开场动画、趴在输入框边偷看的她、 一张画像式的账户小卡、一枚可以自己摆位置的「狼与香辛料」字标， 以及只在你开始页亮着的右栏待机画面。

目录

章节 · 功能详解的十个小节 这是什么 · 两套配色 功能一览 · 开场动画 安装 · 浮动字标 功能详解 · 偷看的她 插件设置项 · 动态档案卡 目录结构与素材 · 日志标签 常见问题 · 侧栏脚下的麦田 实现要点 · 插件详情页横幅 已知边界 · 右栏待机画面 许可证与版权 · 小鲸鱼挂件联动

关于这个目录的方框：GitHub 的 Markdown 渲染器会剥掉所有 style 与 color，

没法给目录加自定义底色的圆角外框。表格是唯一既自带底色与边框、又保留可点击链接

的结构，所以这里用表格来画这个框——底色与线条是 GitHub 主题给的灰调，

不是插件的米色，这点无法改变。

这是什么

说明：上方这张横幅是图片，配色取自插件浅色「麦秋晨光」——米黄 #FBF7EF 底、

深米色 #DCC9A8 双线圆角外框、金色 #A2701F 分隔线，文字 #6E5D46。

GitHub 会剥掉 README 里所有的 style 与 color 属性，页面本身的底色和文字颜色改不了，

能承载配色的只有图片。

项 · 说明 形态 · 正规 DSH 插件：index.js（宿主半）+ client.js（浏览器半）+ assets/ + 素材/ + cordis.patch.yml 插件大小 · 约 16 MB（client.js 与 index.js 合计约 193 KB，其余全是素材；docs/ 的 0.95 MB 配图不参与运行时） 素材 · 图片 9 张、视频 6 组、音频 3 件，由宿主侧的 HTTP 路由送出 配色 · 浅色「麦秋晨光」与深色「星夜麦田」（开发中，测试功能） 依赖 · Node ≥ 22；无第三方运行时依赖

设计上有两条原则：

1. 不改宿主布局。 所有装饰要么是挂在 `` 上的独立浮动层，要么是纯 CSS 规则，

不改宿主的 flex 盒、尺寸与 overflow。

1. 全部可关。 每个组件在插件设置里都有开关，关掉即彻底移除，不留残余节点。

功能一览

功能 · 一句话 两套配色 · 浅色羊皮纸 / 深色暖墨（深色为测试功能） 开场动画 · 12 秒 canvas 实时绘制：暗里的红眼 → 狼影描红 → 光炸开 → 标题解码 → 就绪 浮动字标 · 「狼与香辛料」字标，位置 / 大小 / 不透明度可调，可整个关掉 偷看的她 · 输入框边只露兜帽和一双眼，指针靠近会升起；可左右拖动 探头语音 · 点她会「疑惑」一声（可关） 动态档案卡 · 悬停左下账户行，升起一张 Steam 式小卡 日志标签 · 「思考 / 读取 / 运行命令」等行内标签各一档暖色 侧栏麦田 · 侧栏脚下的一片麦穗，宽度跟着侧栏走，高度锚在账号行 插件详情页横幅 · 插件管理器里点进本插件时，内容顶部一张 1920×620 的封面 右栏待机画面 · 只在右栏自己的开始页亮的一段动画，六片可换，一进去干活就熄 小鲸鱼联动 · 一键把两个角色 + 一条语音装进 dsh-whale-widget

安装

前置

• DeepSeek Harness 已安装并能正常打开 Web GUI
• 本仓库已下载到本地任意目录（下称 ``）

方式：本地目录 + link: 依赖

第 1 步，打开 profile 的 package.json：

%USERPROFILE%\.dsh\profiles\desktop\package.json

加入两处（其余内容保持不动）：

{
  "dependencies": {
    "dsh-theme-holo": "link:A:/你的路径/dsh-theme-holo"
  },
  "dsh": {
    "profile": {
      "bundles": [
        "dsh-theme-holo"
      ]
    }
  }
}

link: 后面用正斜杠，路径里不要有空格；Windows 盘符写法是 link:A:/...。

第 2 步，在 profile 的 node_modules 下建一个目录链接（管理员 PowerShell 或 cmd）：

mklink /J "%USERPROFILE%\.dsh\profiles\desktop\node_modules\dsh-theme-holo" "<插件目录>"

第 3 步，重启 DSH。

装好后打开界面：开场动画播完、页面加载完成，如果检测到小鲸鱼挂件，会弹一次 「要不要把赫萝装进挂件」的对话框（见小鲸鱼挂件联动）。不想装就选「暂不安装」， 之后不再弹。

卸载

删掉上面加的两行（dependencies 一行、bundles 一行），重启即可。

插件所有效果都挂在自己的 fiber 上：样式表、片头层、偷看层、档案卡、浮动字标、 麦田、待机画面、日志标签属性，都会随 fiber 一起移除，不会在页面上留下任何东西。

目录本身和 junction 可以留着（下次启用只需把两行加回来），也可以一并删掉。

功能详解

两套配色

浅色「麦秋晨光」与深色「星夜麦田」（开发中，测试功能），两套值键一一对应。

• 浅色规则挂在 html body:not([data-ds-dark-theme]) 下；
• 深色规则挂在 html body[data-ds-dark-theme] 下。

两套值分别在 client.js 顶部的 PALETTE 与 PALETTE_DARK 两张表里，由同一个循环展开成 CSS 变量。 两张表的键名与顺序必须完全一致，改了一个就要改另一个。

黑夜模式开关走的是主题服务的 setTheme('dark' | 'light')，和「设置 → 外观」用的是同一个 偏好字段，所以两处是同一个状态，不会出现「设置里是深色、插件里写着浅色」的分裂。 宿主没有 theme 服务时回退为直接切 body[data-ds-dark-theme]。

首次安装默认浅色：DSH 的外观偏好出厂值是「跟随系统」，系统本身是深色的机器，一装好就落在 深色 GUI 上，再叠上「星夜麦田」很容易被误读成「装了插件就被切成黑夜模式」。所以插件在首次 运行（localStorage['dsh-theme-holo.dark-defaulted'] 尚未落闩时）若发现宿主已解析为深色， 会通过主题服务把偏好改回 light 一次并落闩；此后只有设置卡片里的开关能再打开深色，插件不会 跟你后来的选择对着干。本来就是浅色的机器不会被碰，只落闩。

黑夜模式尚未完全适配：深色下仍有若干细节是按浅色调的，观感不如浅色完整。设置卡片里为此 加了一行提示——「黑夜模式未完全做好适配，请谨慎打开」。

深色下暖色装饰整体收起：麦穗纹、飘落的麦粒、偷看的她、连接线这些按浅色羊皮纸调的装饰， 压到深色上会脏，所以用一条规则统一隐藏，只留深色外壳与星夜麦田的 token 值。 浮动字标与联动弹窗不在其列——字标是品牌标识，两套配色下都该在。

开场动画（12 秒，实时渲染）

不是视频，是 canvas 2D 逐帧绘制，用 requestAnimationFrame 按真实时间推进。 画布固定 1920×1080，帧率 30 fps，总时长 12 秒。

时间轴：

秒 · 画面 0.8 · 全黑，闭着的眼睑先透出红光 1.15 – 1.95 · 缓缓睁眼（先半睁，再完全睁开） 2.45 / 2.92 · 两次眨眼，每次 0.2 秒 3.25 – 3.6 · 视线移向左边的狼影 3.4 – 6.1 · 镜头在黑暗中后拉 3.75 – 5.15 · 狼影轮廓被红光从背脊描到吻部 4.85 · 狼影的眼睛亮起 5.2 – 7.0 · 狼嚎 6.35 · 她眨一只眼 6.55 – 7.95 · 光从双眸炸开，照亮整张画 7.9 / 8.45 · DEEPSEEK 逐字解码出现，HARNESS 字距收拢 8.55 – 9.25 · 拉出一根「缰绳」，线头一颗红点 9.05 – 9.85 · 三行启动日志逐字打出 9.9 – 10.45 · 进度条走满 10.5 / 10.75 · 就绪闪光、标语 11.3 – 12 · 只淡出声音，画面停住

操作

• 任意点击 / 按键立刻结束，0.55 秒淡出后交还屏幕。
• 右下角有 跳过动画 按钮，效果等同于点画面任意处。
• 系统开了「减少动态效果」（prefers-reduced-motion: reduce）时直接停在收尾帧。
• 音轨默认关闭，右下角开关是 ♪ 音效 开 / ♪ 音效 关。打开后会立刻播放并自动对齐当前画面时间，

选择记在本地，下次启动沿用。点开关不会跳过片头。

• 插件设置里可以永久关闭开场动画（见插件设置项）。关掉后连 canvas 都不创建，

下一帧就把屏幕交回。

调试入口（写在 URL 里）

• #boot-hold 把片头停在关键帧；#boot-hold=11.4 可指定任意秒数，缺省停在 10.2 秒。
• #videocap 停在片头供录屏，#videocap=tail 额外多留 5 秒画面。

浮动字标

「狼与香辛料」字标（assets/logo.png，591×125 透明 PNG）是一块自己定位的图： position: fixed + 视口百分比，挂在 `` 上，位置和大小由插件说了算。

为什么不做成标题栏里的水印：尺寸和位置会被宿主的 flex 盒、容器单位与 overflow 规则牵着走， 插件改不动；而且一开插件设置页（宿主会换掉主面板），整棵会话连同标题栏被卸载，水印得靠常驻观察器 才能回来。挂在 `` 上这两个问题都不存在。

位置以视口百分比存储（xPct / yPct / wPct），渲染时用 vw / vh 单位， 所以窗口缩放、最大化、换分辨率都不需要监听 resize，字标自动等比跟随。

日常不拦点击：图层常驻 pointer-events: none、aria-hidden="true"，不挂任何监听。 只有打开「更改 logo 位置」时才变成 pointer-events: auto，那时才能拖动。

调位置、调大小

1. 插件设置里点「更改 logo 位置」，字标出现一圈细线框、右下角小方块和实时坐标读数；
2. 拖图片移动，拖右下角小方块改大小，读数会实时显示 x, y · 高 Npx；
3. 按 Esc 也能退出；点「完成调整（固定下来）」把位置写进本地存储。

同一节里还有：

• 关闭 logo：整个图层收掉（不是把不透明度降到 0——隐藏的东西不该还能接点击）。

位置和大小原样保留，再点「显示 logo」就回到刚才停的地方。

• 恢复默认位置：位置、大小、不透明度、显隐四项一起回到出厂值。

不透明度：10%–100% 的滑块，出厂 50%，拖动即时生效、松手即存。 下限是 10% 而不是 0：一个几乎透明的字标等于一件找不回来的东西。

图层高度：z-index: 2。这个数字是调出来的——-1 会被宿主的 .BynINW_frame （不透明背景）整个吞掉；0 / auto 会和它同趟按文档序绘制，而插件在宿主渲染外框之前就挂载了， 反过来被盖住。2 压得过外框，但低于宿主自己浮起来的控件（缩放手柄、overlay 层等）。 编辑态会升到很高的 z-index 并开启 pointer-events。

代价是它会压在别的东西上——它本来就在 GUI 之上。这是有意的取舍：字标是一块可以挪的图，

不是垫在纸下面的水印。想让它让开就把图拖走，或者在设置里「关闭 logo」。

偷看的她

输入框边上只露兜帽和一双眼，指针靠近会升起。所有动作由一个状态机驱动： 露出多少、倾角、让位、点头四个量，行为只写目标值，循环以 0.14 的系数缓动过去， 所以永远不会「跳」。

状态 · 触发 · 表现 常态 · 无输入 · 露出 32%，只到眼睛；整体再下沉 10px，底边被输入框卡片裁掉 正在打字 · 输入框有内容 · 露出 58%，朝文字倾，并从她手边拉出一根金线接到输入框 生成中 · 出现「停止」按钮 · 露出 62%，朝文字方向倾，盯着看 长文看累 · 输入 > 420 字 · 沉下去、透明度降到 55%，歪头表示嫌弃 打瞌睡 · 空闲 170 秒（23:00–05:00 为 75 秒） · 只留帽檐，鼠标一动就醒 打开菜单 / 弹窗 · 有 [role=menu/dialog/listbox] 或 aria-modal · 往右让开自身宽度的 55% 并透明到 0 靠近 · 指针在 96px 内但没落在她身上 · 往下缩 5px、歪头 指针移动 · 以她自己的中心算方向 · 整颗头朝指针倾斜，位移上限 ±10px / ±3px，倾角上限 ±2.2° 点击她 · 点 · 纵向压扁一下 + 6 粒金麦从卡片后面飘起，并播一句应答语音 悬停 5 秒 · 一直指着她 · 一枚小苹果从帽檐后滚出来（纯 CSS 画） 发送 · 点发送或回车 · 往下点一下头（320ms）

麦粒和苹果都是临时节点，动画结束即移除；金线是 SVG 路径，只在「打字且没有弹窗」时出现。 「减少动态效果」时所有缓动系数置 1，麦粒和苹果直接不出现。

她可以左右拖：位置是输入框宽度的分数（不是像素），默认 0.72。 位移不到 4px 不算拖动，照常当成「点她」；拖过了就把这次抬手产生的 click 吃掉，不会误触发语音。 位置夹在她的中心可达范围内，插图不会跑到输入框两端之外。

点她会说话：assets/peek-voice.wav（「赫萝疑惑」）复用同一个 Audio 元素， 每次点击先 pause() 再把 currentTime 归零，所以连点不会互相打断、也不会叠音轨。 浏览器不给自动播放权限时静默失败——视觉反馈照常，不弹错。

关掉她：插件设置里的「探头的赫萝」开关，关掉后彻底不显示。语音可以单独关： 「探头的她说话」关掉后，点她只有动作，没有声音。