移动端界面适配autumnshiu009-ship-it/dsh-mobile-ui

dsh-mobile-ui

DeepSeek Harness Web GUI 的移动端适配插件（dsh profile bundle）。浏览器端注入一份响应式样式表 + 几个小 DOM 效应，主机端为空操作。

截图

| 主界面 | 侧边栏（已模糊本地目录） | 设置 | 模型菜单 |
| --- | --- | --- | --- |
| 主界面 | 侧边栏 | 设置 | 模型菜单 |

侧边栏截图中的本地文件夹/会话列表已模糊处理，避免公开仓库泄露本地目录结构。

功能

布局
- 顶栏（≤768px 竖屏）：[侧边栏开关] [会话标题] …… [＋新建会话]，其他按钮精简到二级页面
- 二级侧边栏（push 导航）：点开时当前页面右滑、侧边栏全屏从左滑入；页面内仅「工作区文件夹 + 会话列表」可纵向滚动，头部 / 工作区栏 / 底部设置区冻结
- 会话标题：从对话头部移入顶栏（开关按钮右侧），超长省略，实时同步
- Session log 按钮：移到二级页面与新会话按钮并排（各占一半；无会话时新会话按钮恢复全宽）
- 对话头部：单行布局，左侧 tabs 与右侧控件按文字中线对齐；右侧（标准模式/后台任务/子代理）超宽时在分隔线后横向滚动，不挤压左侧

弹窗
- 视口钳制：模型菜单、上下文仪表盘、后台任务、子代理、命令面板、"/" 输入触发菜单——水平方向保证左右 ≥8px 边距，垂直方向空间不足自动翻转，内部滚动
- 层叠置顶：头部 actions 容器提升 z-index，弹窗永不被对话消息层覆盖
- 打开期间临时解除祖先容器的滚动裁剪，关闭后恢复

触控与细节
- 顶栏 / composer 按钮隐形热区扩展至 ~42–44px，视觉不变
- 按压反馈：:active 缩放 0.94（按下平滑、松手即回弹）
- 安全区：注入 viewport-fit=cover，顶栏 / 抽屉 / 设置 / 统计行叠加 env(safe-area-inset-)
- 横屏手机（≤1024px + 高度 ≤540px）：左右安全区 + 底部 inset
- prefers-reduced-motion：关闭 push 动画与按压反馈
- 滚动穿透防护：overscroll-behavior
- 统计行点击展开 / 使用量图表居中

安装

方式一：本地插件目录（推荐）

mkdir -p ~/.dsh/local-plugins
git clone https://github.com/autumnshiu009-ship-it/dsh-mobile-ui.git ~/.dsh/local-plugins/dsh-mobile-ui

然后重启 DSH Web：

systemctl --user restart dsh-web.service
或
dsh web

方式二：使用 dsh plugin 命令

如果你已经下载/克隆到本地的 /path/to/dsh-mobile-ui：

dsh plugin --profile web add /path/to/dsh-mobile-ui
dsh plugin --profile headless add /path/to/dsh-mobile-ui

然后重启 dsh web。

说明

- cordis.patch.yml 由 profile bundle 装配器加载
- 浏览器端通过 dsh.client 声明注册
- 浏览器端修改后刷新页面即生效（rev 按内容自动更新），无需重启

维护说明

- 插件 CSS 使用上游 UI 的 CSS Modules 哈希类名（如 .pI_x6G_frame、.hHd-Xa_root）。上游 UI 构建更新后哈希可能变化：从服务的 bundle（/plugins/@deepseek-ai/dsh-client-ui-/client.js）中重新核对类名即可
- client.js 中的 CSS 为模板字符串，按分区注释组织（触控打磨 / 竖屏布局 / 横屏安全区 / reduced-motion）
- DOM 效应（标题注入、Session log 代理按钮、弹窗钳制、裁剪解除）全部经 ctx.effect 挂载，卸载即清理