dsh-custom-style：给 DeepSeek Harness 注入自定义样式

前言¶

DeepSeek Harness（DSH）的设置面板默认尺寸固定，不同页面的宽度限制也不统一，改起来要么要改源码，要么要重启应用。dsh-custom-style 在 DSH 设置里新增一个「自定义样式」分区，让你直接编辑样式文件来调整弹窗宽度、导航宽度、字号与内容居中，也可以给界面加一张带磨砂遮罩的全屏背景图。改动保存约两秒生效，不需要重新打包或重启 DSH。

是什么¶

• 插件名：dsh-custom-style
• 维护者：yutao8
• 分类：趣味换装
• 核心能力：把 $DSH_HOME/dsh-custom-style/ 下的 *.css 文件按文件名顺序拼接，注入到 DSH 界面；在设置里新增「自定义样式」分区，提供调节、背景与选择器与目录三页。
• 运行机制：宿主半身（index.js）拼接样式表并通过 /dsh-custom-style/all.css 提供给浏览器半身（client.js）；浏览器半身每两秒拉取一次并注入到 <style data-plugin-css="dsh-custom-style"> 中，页面隐藏时暂停拉取。

安装与启用¶

安装前确认 DSH 版本为 0.2.x，已在 0.2.0-rc.2 上验证。

1. 使用官方安装命令（插件被收录到插件目录之后可用）：

dsh plugin add dsh-custom-style

2. 或从仓库安装到当前机器：

node install.mjs --apply

安装后完全退出并重开 DSH 一次，宿主半身在启动时注册路由。之后修改 CSS 文件或通过面板调整，无需再次重启。

使用¶

打开 设置 → 自定义样式。面板分为三个页：

• 调节：八个数字输入项 + 六组预设（宽视野、紧凑、纵向扩展、小巧、最大化、恢复默认）。预设按钮在输入项上方，先套用预设再微调；点击「应用」会将当前设置写入 20-quick-settings.css。
• 背景：图片地址（支持网址或本地选择）、遮罩浓度、背景模糊、平铺方式；带缩略图预览与「清除背景图」按钮。
• 选择器与目录：显示当前 CSS 文件存放路径，提供「打开目录」按钮；列出从 DSH 源码核对过的稳定选择器示例与一键「复制」代码片段。

习惯直接改文件也可以：编辑 $DSH_HOME/dsh-custom-style/ 下的任意 *.css（默认在 C:\Users\<你>\.dsh\dsh-custom-style\），保存后约两秒生效。文件名决定拼接顺序（00- 在前、99- 在后），同特异性下后写入的规则优先。

典型用法¶

下面是一个示例配置，调整设置弹窗宽度、左侧导航宽度与正文字号：

/* 01-my-tweaks.css */
[data-shortcut-modal="settings"] { width: 1200px !important; }
[data-shortcut-modal="settings"] nav { width: 220px !important; }
body { --dsh-content-font-size: 15px !important; }

• 设置弹窗宽度：默认 800px，通过 [data-shortcut-modal="settings"] 修改。
• 左侧导航宽度：默认 188px，通过 [data-shortcut-modal="settings"] nav 修改。
• 正文字号：通过 body 上的 --dsh-content-font-size 变量修改。

文件保存后，插件会在 ≤2 秒内重新拉取样式表并应用。

稳定选择器¶

官方类名是构建期哈希（如 .wCInkW_panel），升级后会变化。建议优先使用 data-*、aria-*、role 等稳定属性。常用选择器示例：

完整清单见仓库中的 selectors.json。

工作原理¶

$DSH_HOME/dsh-custom-style/*.css
        │  按文件名顺序拼接，每个文件前加一条 "/* ===== 名字 ===== */" 横幅
        ▼
index.js（宿主半身）──GET /dsh-custom-style/all.css──▶  client.js（浏览器半身）
        │                                                    │
        └─ 自动创建目录、播种 00-starter.css                   └─ <style data-plugin-css="dsh-custom-style">，每 2 秒轮询

• 宿主半身（index.js）：
• 首次运行自动创建 $DSH_HOME/dsh-custom-style/ 目录，并在缺失时写入 00-starter.css，绝不覆盖已有文件。
• 通过 /dsh-custom-style/all.css 提供拼接后的样式表（Cache-Control: no-store）。
• 提供 /files、/file、/file/delete、/reveal 等接口，用于列出文件、读写/删除单个文件、显示文件路径。
• 浏览器半身（client.js）：
• 将样式表注入到 <style data-plugin-css="dsh-custom-style"> 中。
• 每 2 秒重新拉取一次样式表；页面隐藏时暂停拉取，以节省资源。
• 通过客户端 slot API 注册设置分区。

零第三方运行时依赖：宿主半身只用 node: 内置模块，浏览器半身只用 DOM、fetch 和平台提供的 React。因此 DSH 升级不会破坏插件，用户 CSS 存在包外，重装插件也不会丢失样式。

适用场景与注意¶

• 适合需要精细调整 DSH 设置界面布局、字号、间距，或为界面换肤的用户。
• 插件以 DSH 进程权限运行，安装前建议查看仓库源码与许可证（MIT）。
• 设置面板内的「内容居中宽度」默认为 0，表示保留各页自己的宽度并居中；填入数字可统一宽度并居中；若希望内容铺满，可在同一选择器组上加 max-width: none。

短结尾¶

dsh-custom-style 让你直接在 DSH 设置里改样式，文件保存约两秒生效，无需重启应用。更多细节与示例见插件目录页与 GitHub 仓库。