前言¶

DeepSeek Harness（dsh）的网页设置面板默认宽度为 800px。在移动端浏览器上查看时，这种固定宽度会导致布局错乱，控件难以操作。dsh-mobile-ui 插件通过 CSS 覆盖技术，解决了这一问题，它将原本为桌面端设计的模态框适配到移动端视口。

插件定位¶

dsh-mobile-ui 是一个 Responsive CSS override plugin（响应式 CSS 覆盖插件）。它由 jackuh105 维护，旨在将 DSH 的桌面设置模态框适配到移动端视口。

核心功能¶

在视口宽度 ≤ 680px 的移动浏览器环境下，插件会自动调整布局：

1. 将 800px 宽度的桌面模态框转换为全屏垂直表单。
2. 将左侧 188px 的导航栏 rail 转换为顶部全宽、可水平滚动的标签栏。
3. 将关闭按钮固定在右上角。
4. 内容区域填充剩余高度，支持独立滚动并包含安全区域填充。
5. 允许常规设置行换行，避免控件被挤压出屏幕。

安装与启用¶

安装前需确认 dsh 的配置目录是 pnpm workspace 根目录，部分 pnpm 版本需要 -w 参数。

执行安装命令：

dsh plugin --profile web add -w https://github.com/jackuh105/dsh-mobile-ui.git

安装完成后重启 web profile：

dsh web

验证与使用¶

安装生效后，可以通过以下方式确认：

1. 打开浏览器开发者工具，检查 HTML <head>，确认包含 <style id="dsh-mobile-ui">。
2. 将桌面浏览器窗口宽度缩小至 680px 以下，打开设置面板，观察布局变化。

注意事项¶

1. 兼容性：当前 CSS 选择器针对 dsh 0.1.0-rc.6 的结构。若 DSH 升级导致类名变更，可能需要更新插件内的选择器。
2. 定制：如需修改断点（例如将 680px 改为其他值），可编辑 lib/index.js 中的 CSS 字符串，然后重启 dsh web。

总结¶

通过引入此插件，开发者可以在移动端获得更友好的 DSH 设置面板体验。源码及更新见下方链接。