dsh-UI美化

为 DeepSeek Harness 提供独立的任务面板、输入栏与侧栏材质，以及背景、主题切换和对话动效。各区域分别配置，默认样式排在材质选项最前面。

设置入口：设置 → dsh-UI美化。仓库、包名和插件标识统一为 dsh-ui-beautify；旧版 dsh-claude-beautify 的本机偏好会自动迁移。代码 MIT；可选鲸鱼娘素材为 CC BY-NC-SA 4.0，详见许可说明。

功能详解 · 交付与兼容 · 更新记录 · 安装 · 来源与许可

截图使用合成内容。Artifact 预览见 截图。

功能一览

设置分类	可以调整的内容
任务面板	右上角任务进度、输出文件、工具与资源摘要；悬停预览或点击固定；按当前轮或全部轮次浏览；选择卡片材质、280–480px 宽度、默认 2/3 步和栏目开合。
输入栏	独立选择输入框材质；独立开启小按钮 Lens 玻璃；选择对话是否滚到输入栏后方；保留原生输入、模型选择、录音、发送和停止操作。
侧栏	独立选择侧栏材质和切换动效；左右面板覆盖主屏幕或恢复并排布局；顶部标题、标签与正文对齐，显示实际所属项目；圆角和选中反馈跟随明暗主题。
开屏欢迎	原生 Logo、欢迎文字、本机字体和书写速度；也可导入自己的图片、动图或视频，直接预览。
全图背景	本机图片、视频与 HTML 素材库；日夜主题分别记住选择、启用状态和上一张；调整可见度、模糊、铺放、位置和视频声音。
粒子背景	DeepSeek Logo、鲸鱼娘、自定义图片或 SVG；图片细节优先取点、选图建议和完整成形缩略预览；500–20000 颗粒子；手动调整成形进度，或跟随真实上下文占用；设置开始显示与完整成形阈值；成形后保持粒子漂浮。
对话动效	默认、轻盈卡片、极简分隔；用户消息气泡的 QQ 蓝、便签、玻璃和自定义 CSS；艺术字、自定义分隔动图和 CSS；新消息入场预览与开关。

顶部另有 日夜主题开关 和 专注模式：主题使用 DSH 自身的设置服务；专注模式暂时收起输入栏、侧栏、会话标题与浮动面板，将标签和顶部操作收成一行，让正文向上扩展。标签沿正文实际左边缘对齐，工具保留在右上角；调整行宽或切换标签后继续跟随。再次点击或按 Esc 恢复原来的标题、布局和草稿。

顶部标题和「对话 / 轨迹 / 上下文」支持宿主的插槽包装布局，跟随当前可见视图定位；隐藏的聊天和嵌套会话不会把标签带偏。

七个设置分类会记住上次选择：关掉设置、刷新或在同一浏览器来源重新打开后继续回到该分类。无效分类回到“任务面板”；本机存储不可用时保留本次窗口内的选择。分类切换支持方向键、Home/End，窄窗口可横向滑动。

进度面板切换「当前轮次 / 全部轮次」或前后轮次时，内容相同就不重播整块刷新动效；选中状态和轮次信息照常更新。

粒子图片推荐透明背景、单一主体、轮廓清晰和明暗对比强的素材。导入后优先采样图中各处的线条与局部细节，不套用固定的人脸位置；彩色底图仍会参与取点，需要预先去底。粒子背景 → 本机图片 下的完整成形缩略预览随粒子数和明暗主题更新，静止后不持续绘制；聊天的转换进度保持独立。已有图片刷新后直接使用新采样，无需重导。

配置两份 HTML 时，先切到日间主题，应用日间背景，再切到夜间主题应用另一份。刷新后分别恢复；关闭或清除只影响当前主题。升级前的 HTML 归入升级时的当前主题，另一侧留空；原有图片、视频沿用到两侧。素材库共用，可见度、模糊等外观参数仍共用。

安装与更新

需要 Node.js 22.13+，宿主范围为 DSH >=0.2.1-rc.2 <0.3.0-0。本机实际回归版本是应用归档内的 DSH 0.2.1-rc.2，桌面外壳版本与其不同。运行时使用宿主提供的 React 和服务；构建、测试依赖仅供开发使用。

普通安装：从本仓库 最新 Release 获取预构建包 dsh-ui-beautify.tgz，在 DSH 插件页按 URL 安装。插件市场的收录以社区目录审核合并为准。包内已有客户端，不需要在使用者机器上构建，也不要求安装配套插件。

Web profile 也可执行：

dsh plugin --profile web add https://github.com/AumiSatori/dsh-ui-beautify/releases/latest/download/dsh-ui-beautify.tgz

开发者源码链接安装：在长期保留的源码目录克隆仓库，然后进入该目录：

git clone https://github.com/AumiSatori/dsh-ui-beautify.git
cd dsh-ui-beautify
node scripts/profile.mjs install --profile desktop
node scripts/profile.mjs check --profile desktop

默认 DSH 用户目录为 ~/.dsh，可通过 DSH_HOME 指定其他目录；--profile 指向已有 profile。市场包和源码链接请选择一种方式，不要重复登记。

安装器登记 link: 依赖、锁文件和 bundle，并建立源码链接；遇到目录被占用、重复加载或未知锁文件结构会保留现场并停止。安装前备份位置见下文。旧版源码链接可直接重新运行安装器：只迁移指向本源码的旧链接、依赖与 bundle，其他安装保持原样。旧版市场包请先在插件管理器移除，再安装新名包，避免两个版本同时加载；移除登记不清除本机偏好与素材。

• 首次安装或卸载：等当前任务结束，完全退出 DSH，包括托盘，再启动。
• 更新已有链接版：在源码目录执行 git pull --ff-only，再运行安装检查。只有客户端内容变化时，DSH 窗口按 Ctrl+R 即可。
• 修改源码后：先运行 npm run build:lens 重新生成客户端包，再检查和刷新。只改 src/ 不构建不会更新客户端效果。
• 其他方式安装的副本：源码更新不会自动同步到独立的 node_modules 副本，需要重新安装或同步；以安装检查结果为准。

内置 Artifact 预览

Artifact 预览与任务卡片是一套功能，随 设置 → dsh-UI美化 → 任务面板 → 右上角任务面板 一起启用。所有卡片材质均可使用，从卡片的“输出”点击文件，在右侧覆盖阅读，不挤压聊天。支持预览、源码、刷新和“用 DSH 打开”；图片直接查看，CSV 显示前 500 行。输出只来自当前所选轮次记录的交付文件，不自动扫描聊天正文或磁盘。旧版独立开关的选择不再限制预览。

HTML 支持单文件内的样式和脚本交互；外部脚本、网络请求及相邻文件依赖暂不加载，这类页面可选择“用 DSH 打开”。文字预览上限 2 MB、图片 8 MB；最近三个 HTML 可显示静态封面，封面上限 512 KB。读取失败会显示重试和原生打开入口。不支持的文件仍交给 DSH。

关闭任务面板会一起收起预览并取消读取。仅本卡片的输出点击使用内置阅读器；不读取或覆盖外部插件的全局预览接口、不注册其他插件的产物插槽，也不关闭其窗口。本机 dsh-artifact-preview 0.1.2 已验证两种加载顺序下入口及窗口状态保留；任意第三方插件仍可能因相同弹层位置或自身的全局接管产生冲突，多个预览同时打开时可能重叠。

材质和开销

任务面板、输入栏、侧栏分别选择材质，互不绑定，也会分别记住选择。

选项	效果	相对开销
默认 milk	恢复该区域的原始或基础表面	低
透明玻璃 clear	通透表面、边缘折射、高光与交互追光	较高，受面积和背后内容变化影响
轻量玻璃 css	CSS 亮边与轻微背景模糊	较低
毛玻璃 glass	干净白底、清晰亮边和柔和悬浮阴影；22px 背景模糊，深色使用烟色表面	随场景变化；有额外绘制开销，不能直接等同于高功耗

小按钮 Lens 是单独的绘制功能，可搭配任意输入框材质。它保留真实浏览器背景，在小范围内模拟光学边缘；不会把整段聊天截图送入 WebGL。透明玻璃的实际折射也取决于宿主渲染能力。

毛玻璃的白底、亮边与阴影参考推理滑块的表面观感，沿用已有材质选项；任务面板、输入栏和侧栏均生效。模糊仍为 22px，不新增持续绘制循环。性能标签描述绘制方式，不是整机功耗测试：背景模糊会增加渲染工作，是否明显影响流畅度或耗电需要按面积、背景内容、设备和浏览器实测。web.dev 与 WebKit 均说明应评估实际性能；本项目没有提供瓦数或续航结论。

希望降低负担时，可使用默认或轻量玻璃、关闭小按钮玻璃与粒子背景，并将对话设为极简分隔。新消息入场和主题切换主要是短时开销；粒子背景属于持续绘制，不能视作无开销。

初次使用时，三个主要材质均为默认；任务面板默认开启、宽度 320px、附近步骤显示 3 步，新消息入场开启，对话分轮保持默认。开屏欢迎默认开启；粒子默认开启并使用 Logo、9600 颗、跟随上下文，0% 开始、80% 完整成形。全图背景默认关闭。旧安装保留已经保存的选择，部分历史设置按兼容规则迁移。

用户消息气泡与 CSS

在 设置 → dsh-UI美化 → 对话动效 → 用户消息气泡 选择样式，默认恢复原始外观。QQ 蓝使用渐变与小尾巴，奶油便签和透明玻璃分别跟随日夜主题；玻璃有背景模糊开销，其余内置例子是静态样式。这里调整的是发送后的提问气泡，底部输入框继续在“输入栏”配置。

选择 自定义 CSS 后可载入 QQ、便签或玻璃的完整例子。草稿先在设置页预览，点 保存气泡 CSS 后应用到聊天；切回默认会保留已保存的代码。简单例子：

.bubble {
  background: linear-gradient(135deg, #2673d7, #3455cb);
  color: white;
  border-radius: 20px 20px 6px 20px;
  padding: 12px 18px;
}
.dark .bubble {
  background: #293d70;
}

支持 .bubble 的悬停、伪元素、子元素，及 @media、@supports、@keyframes。规则只作用于原生用户、追加指令及发送回显的气泡，不替换文字或附件，不接管复制按钮、模型回复或 Artifact 窗口。无额外消息扫描或常驻绘制；自定义动画仍可能持续绘制。系统减少动态效果时关闭气泡动画，强制颜色时恢复可读表面。最多 12000 字符，不加载外部资源，不支持 @import、相邻兄弟选择器和 CSS 嵌套。

分隔装饰与 CSS

选择 对话动效 → 极简分隔 后，可以选择原始细线、彩色细线或艺术字。艺术字为左侧 DeepSeek Harness，可设置颜色和字母轻晃；当前版本没有内置右侧人物，主动导入动图后才显示右侧图片并预留空间。

分隔图片支持 GIF、PNG/APNG、WebP，最大 2MB，边长最多 1024px。关闭动效、离开可见范围、切到后台或系统要求减少动态效果时，动画暂停或使用静态预览。

CSS 编辑器点击“应用 CSS”后保存，点击“清空 CSS”恢复内置规则。最多 12000 个字符，支持 @keyframes，不支持 @import。可使用以下元素和变量；规则只作用于装饰的 Shadow DOM：

.line { height: 2px; background: linear-gradient(90deg, #7597c2, #c4c7de); }
.brand { color: #5068a0; font-weight: 800; }
.divider { --divider-speed: 2.2s; --divider-mascot-width: 118px; }

.letter 用于单个字母，.mascot 用于已导入图片的容器。CSS 不会改变正文、消息按钮和其他插件。尺寸调整过大时，建议同时检查窄窗口中的预览。

设置与素材如何保存

内容	保存位置与范围
材质、布局、动效、面板栏目、粒子与媒体选择	当前浏览器来源的 localStorage["dsh-ui-beautify:settings:v1"]，经过白名单校验。
最后打开的美化设置分类	localStorage["dsh-ui-beautify:settings-tab:v1"]，只保存分类 ID。
背景、开屏媒体、分隔图片、粒子图片与 SVG	当前浏览器来源的 IndexedDB，原文件留在本机；设置中只记录选择信息和修订号。
任务、输出与工具摘要	从宿主已加载的会话投影和事件读取，临时状态留在页面内存。
专注模式、手动浏览历史步骤的位置	当前页面内存，刷新后恢复常规状态。

本插件不把展示偏好或本机素材上传到服务器，不另存聊天副本。不同设备、浏览器、站点地址或来源不会自动共享这些数据；清除站点数据会同时清除对应偏好和素材，请保留需要再次导入的原文件。

首次安装的 profile 备份默认位于DSH_HOME/data/dsh-ui-beautify/install-backups/（默认 ~/.dsh/data/dsh-ui-beautify/install-backups/），可通过 DSH_UI_DATA_DIR 更改；旧环境变量 DSH_CLAUDE_DATA_DIR 仍兼容。运行配置、备份、截图和测试输出不入仓库。

常见问题

情况	处理方式
顶部项目名或主题、专注、任务按钮重复	0.3.72 起对重复加载提供单实例保护。改名升级后已存在的旧实例需完全退出 DSH（含托盘）再启动一次；无需清除设置或素材。
没有设置入口	首次接入后完全退出并重启 DSH；运行 check --profile desktop 核对链接、依赖与 bundle，排除旧 patch 层的重复登记。
修改源码后效果没变	检查是否运行了 build:lens，以及实际加载的是源码链接还是独立安装副本，再按 Ctrl+R。
设置或素材换窗口后不见	核对是否为同一浏览器来源；隐私模式、不同地址和清除站点数据会影响本机存储。
玻璃看起来像静态薄片	纯色背景缺少可折射纹理；宿主不支持背景滤镜时会回退。可用同一背景比较各材质。
GPU 占用高	分别关闭粒子和小按钮 Lens，缩小使用玻璃的面积，切换到默认或轻量玻璃，定位具体开销。
任务面板没有内容	只有真实任务、已声明输出或已加载资源时才展示；缺少轮次边界时不会借用其他轮次的数据。
CSS 或图片导入失败	查看页面错误提示，检查大小、真实文件格式与 CSS 限制；失败时修正后重试。
想调整整个设置窗口或光标	由独立的设置管理、指针皮肤插件提供，见下表。

配套插件

插件	负责范围
dsh-settings-groups	设置入口分组、排序、隐藏、搜索、窗口拖动缩放、一级设置页记忆。美化页内部的七个分类由本插件记忆。
dsh-cursor-skin	设置拖动区的鲸鱼娘张手/握拳、图片缩放与部分横向调整指针，独立安装。
dsh-claude-slider	模型与推理强度选择；本插件提供可选的模型按钮材质适配，不托管该插件。

开发与验证

npm install
npm run build:lens
node --check client.js
node --check index.js
npm run check:lens
npm run check:release
npm test
npm run test:release

浏览器检查需要本机 Chrome；支持该参数的测试可用 PLAYWRIGHT_CHANNEL 选择其他已安装渠道。按改动范围运行对应的 test:* 脚本，完整清单见 package.json。涉及真实宿主组件的检查可用 DSH_ASAR 指定应用归档，只读取代码和样式，使用合成会话数据。

建议设置 DSH_CLAUDE_OUTPUT_DIR 将截图和结果集中到项目集合目录的 .scratch/；各脚本具体默认路径见功能详解。

卸载

node scripts/profile.mjs uninstall --profile desktop

安装器移除本插件的源码链接、依赖、锁记录和 bundle 条目，保留源码与其他插件。随后完全重启 DSH。本机素材和偏好不由卸载脚本主动清除。

程序采用 MIT。玻璃实现与相关依赖的来源、版本及许可见 THIRD_PARTY_NOTICES.md；人物素材说明见 CONTEXT-WHALE-LICENSE.md。本项目是独立扩展。