界面背景图 haozhu11/dsh-plugin-background

dsh-plugin-background

面向 DeepSeek Harness Web 界面（dsh web）的背景图片插件。

从本地选择一张图片作为整个界面的背景，可随时调节主题感知衬底或一键清除——入口是侧边栏底部的"背景"按钮。图片在浏览器端高质量压缩后存入 IndexedDB，重启后依然保留，完全不依赖任何服务端存储。

⚠️ 第三方社区插件，非 DeepSeek 官方产品。
基于 deepseek-ai/deepseek-harness 构建。

(如有截图，放入 docs/ 目录后在此引用。)

功能

- 上传本地图片（PNG / JPG / WebP）作为全界面背景
- 🎨 内置预设背景（一键切换渐变主题）
- 三种显示模式：拉伸铺满（完整但变形）/ 铺满裁剪 / 完整显示（留白）
- 高质量浏览器端压缩（最长边 4096px、WebP 优先、平滑缩放）
- 主题感知衬底（0–80%，浅色主题用白、深色主题用黑），保证文字可读
- ✏️ 可调文字描边强度（0–100%），不压暗背景也能看清对话
- 一键清除，恢复默认主题
- IndexedDB 持久化——大图无压力、重启不丢、无需服务端
- 兼容 HMR（pnpm run dev:web watcher），样式/主题覆盖自动清理

工作原理

- 纯浏览器端 Cordis client 插件，注册到 sidebar.footer.action 插槽。
- 背景图只挂在 body 一层（background-attachment: fixed），叠加主题感知衬底； --dsw-alias-bg-base 覆盖为 transparent，侧边栏填充同样透明——frame、对话区、详情栏、侧边栏全部透出这唯一一张背景，整个界面无缝统一（不会出现各区域各自 cover 一张图导致的多张背景错位）。
- 衬底用 color-mix 混合基础色板 token（浅色主题白、深色主题黑），任意图片下文字都可读；不触碰任何 DOM 选择器。

环境要求

- 可运行的 dsh web profile（DeepSeek Harness ≥ 0.1.0-rc.6）
- pnpm（或带可写缓存的 npm exec）
- Chromium / Firefox 系浏览器

使用

1. 启动 dsh web 并打开界面。
2. 点击侧边栏底部的"背景"按钮（设置按钮旁）。
3. 选择本地图片——立即生效。
4. 用衬底滑杆调节可读性；点"清除背景"恢复默认。

开发

git clone && cd dsh-plugin-background
node build.mjs # 构建一次 → dist/client.js
node build.mjs --watch # 监听 src/client.js 变化自动重建

- 平时只需改 src/client.js（纯 JS + React.createElement，无 JSX/TS）。
- dist/client.js 有意提交进仓库，用户免构建即可安装。
- 改完 src/ 后重新构建并重启 dsh web（或从 harness 源码跑 pnpm run dev:web watcher 走热更新）。

卸载

cd ~/.dsh/profiles/web
pnpm remove dsh-plugin-background
若手动加过，删除 cordis.patch.yml 里的 ui-background 行
dsh web