前言¶
长时间盯着默认的 DSH Web 界面，背景往往是纯色或主题自带的渐变，和聊天、设置区域绑在一起，很难单独换一张图或一段循环视频，又不希望动布局、把侧栏和主区域拆成两套皮肤。社区里也有更重的皮肤中心类插件，功能多，但和「只改底层背景、面板做半透明玻璃」的需求并不完全重合。
下面介绍 dsh-skin-live：在页面最底层挂固定画布，把应用底色透明化，主区域与侧栏共用同一张背景；卡片、输入框、弹层仍在原位置，仅通过主题 token 调成半透明。参数与本地素材留在浏览器里，插件本体不主动联网。目录分类为「趣味换装」，维护者在 SkillHub 上为 kimo-si；实现与安装说明以仓库 README 为准（当前安装标识为 github:zhaochaorui-study/dsh-skin-live）。
这是什么¶
dsh-skin-live 是面向 DSH Web 客户端的全局皮肤插件：用图片或视频铺满整个 Web 界面，只改背景，不动布局。支持本地上传、拖拽，或直接填写图片/视频 URL；提供面板不透明度、素材不透明度、模糊、暗化四项独立调节。停用或卸载后移除背景层并还原主题变量。
- 图片：
PNG、JPG、JPEG、WebP、GIF、AVIF、BMP、SVG - 视频：
MP4、WebM、OGV、MOV、M4V、MKV（静音、循环、自动播放） - 许可：MIT（见仓库
LICENSE） - 包版本（资料中的
package.json）：1.0.0
核心功能¶
背景层与界面关系¶
插件在 document.body 上挂 position: fixed; z-index: -1、pointer-events: none 的独立节点，垫在整个应用之下，不抢占点击。侧栏属于全局背景画布，与主区域共用背景；「面板不透明度」只作用于卡片、输入框、弹层等面板表面，不会单独把侧栏盖成另一套色块。
设置项（设置 → 皮肤）¶
| 控件 | 范围 | 作用 |
|---|---|---|
| 启用皮肤 | 开 / 关 | 临时关掉背景层并还原主题，素材和参数保留 |
| 背景来源 | 文件 / URL | 本地文件进 IndexedDB；URL 由浏览器按地址加载 |
| 铺满方式 | 铺满 / 完整 / 拉伸 | 对应 object-fit: cover / contain / fill |
| 面板不透明度 | 0–100% | 面板表面透明度；0% 全透明，100% 为主题原色 |
| 素材不透明度 | 10–100% | 背景图/视频本身透明度 |
| 模糊 | 0–40px | 只模糊背景层；实现上会略放大背景避免边缘露白 |
| 暗化 | 0–80% | 背景上叠黑色蒙版，深色主题下更易读 |
数据与隐私¶
- 参数：
localStorage键dsh-skin-live:settings:v1 - 本地素材：
IndexedDB库dsh-skin-live:media，仓库blobs，键current - 插件不发起网络请求、不上报数据；填 URL 时由浏览器直接请求该地址
兼容与共存¶
README 记载在 DSH 0.2.0-rc.2 + Web / PWA 上已实测；Desktop（--profile desktop）未验证。插件依赖客户端的 slots、theme、locale 服务；未声明 peerDependencies，服务缺失或接口变化时会退化为无背景，不拖垮主界面。
若与另一套皮肤系统（例如 @linxin666/dsh-client-ui-skin-center）同时启用，两边都会改背景和主题变量，会互相覆盖，建议只保留一套。
安装与启用¶
DSH 自带插件管理器，任选一种方式即可，无需手改配置文件。
方式一：Web 插件页（推荐）¶
- 打开 DSH Web（默认
http://127.0.0.1:3080）。 - 左侧进入 插件（Plugins）。
- 在安装输入框粘贴下面一行并确认安装：
github:zhaochaorui-study/dsh-skin-live
- 安装后默认启用；若未启用，在列表里打开开关。
- 刷新页面（
Cmd/Ctrl + R），设置 中会出现「皮肤」。
方式二：命令行¶
dsh plugin --profile web add github:zhaochaorui-study/dsh-skin-live
README 说明：发布到 npm 之后也可使用包名（以当时文档为准）：
dsh plugin --profile web add dsh-skin-live
桌面版将 --profile web 换成 --profile desktop（README 标注尚未验证）。
方式三：离线 .tgz¶
从 Releases 下载 dsh-skin-live-1.0.0.tgz，然后：
dsh plugin --profile web add /绝对路径/dsh-skin-live-1.0.0.tgz
也可在插件页选择本地文件安装。
验证安装¶
dsh plugin --profile web list | grep dsh-skin-live
dsh --profile web --dump-config | grep -A2 'dsh-skin-live'
预期能看到依赖项，以及 id: dsh-skin-live 的加载项。
典型用法¶
路径：设置 → 皮肤。
- 选择背景 — 点「选择文件」上传，或把图片/视频拖进虚线框；或在输入框粘贴素材 URL。
- 调节参数 — 拖动滑块，画面实时变化。
- 自动保存 — 参数写入
localStorage，素材写入IndexedDB，刷新或重启 DSH 后自动恢复。
首版完整流程即：安装插件 → 选择背景 → 调整模糊和暗化（以及面板/素材不透明度、暗化等按需微调）。
卸载与回滚¶
停用（保留数据）：在插件页关开关，或在设置里关「启用皮肤」，背景立刻还原，数据仍保留。
彻底卸载：
dsh plugin --profile web remove dsh-skin-live
在插件页确认已移除并刷新。若要清理本地数据，可在浏览器控制台执行：
localStorage.removeItem('dsh-skin-live:settings:v1');
indexedDB.deleteDatabase('dsh-skin-live:media');
适用场景与注意¶
适合希望在 DSH Web 上快速换壁纸、用视频做氛围背景、又不想改布局或装一整套皮肤中心的用户。插件以轻量 bundle 为主（README 称本体几十 KB、不带内置素材），素材由用户自备。
安装前建议自行查看仓库源码与 MIT 许可证。插件随当前 DSH 进程与 Web 客户端权限运行；使用 URL 背景时，浏览器会按你填写的地址发起请求，请注意素材来源与跨域策略。SkillHub 目录与 GitHub 为社区分发渠道，与 DeepSeek / 幻方无官方从属关系；DSH 生态强调「一切皆插件」，是否安装由你自己评估。
结尾¶
dsh-skin-live 把「铺满界面的图/视频 + 半透明面板 + 本地存储」收在一个设置页里，停用或卸载即可回到默认外观。目录页：SkillHub — kimo-si/dsh-skin-live；代码与详细说明：GitHub — kimo-si/dsh-skin-live（安装标识与 Releases 链接见 README 中的 zhaochaorui-study/dsh-skin-live）。
