前言¶
智能体开发者经常需要在手机上查看对话结果或调试输出。DSH Web 默认在桌面端运行，移动端布局会压缩对话区、占用较多屏幕空间，体验不够友好。这个插件为 DSH Web 提供了一个移动端专用外壳：在移动视口下自动切换成抽屉导航、全屏对话、触控友好的界面，桌面端行为保持不变。
插件定位¶
dsh-mobile-ui 是一个 DSH Web 插件，为移动端提供专用 UI 外壳。插件由 kaijia323 维护，分类为客户端插件。它在视口宽度 ≤ 767px 时生效，通过 html[data-dsh-mobile] 标记区分移动端与桌面端。
核心功能¶
抽屉式导航¶
左侧栏在移动端不再占用 grid 宽度，改为覆盖式抽屉（84vw，最大 320px，带圆角和阴影）。顶部栏左侧出现汉堡键用于打开抽屉。点击会话行、点「新会话」（含品牌区）、切全局面板会自动收起抽屉。点遮罩或按 Esc 也会收起（有菜单打开时 Esc 只关菜单，抽屉留在原地）。抽屉内的就地操作（搜索、工作区展开、会话「…」菜单、底部「更多」菜单、菜单里的置顶/归档/设置）不会关闭抽屉。
全屏对话区¶
对话区占满整屏，不与左侧栏共用宽度。全局面板（插件页、自动化任务等）底部有栏，左键开抽屉、右键回对话，避免”出不来”的死路。
设置面板适配¶
移动端设置面板改为全屏、分类横向排列，主题选择以三块并排显示。
安全区适配¶
宿主侧通过 viewport-fit=cover 注入页面，样式里使用 env(safe-area-inset-*) 给抽屉、顶栏、输入区留出刘海和小白条的位置。
键盘适配¶
跟踪 visualViewport，用 --dsh-mobile-vv 让布局高度跟随可见区域，输入框不会被软键盘顶出屏幕。切会话、新建会话、首次加载时输入框不自动聚焦；点「＋」时需要输入框焦点才能挂出菜单，只在同一轮点击内短暂聚焦。
触屏可达¶
会话行「…」和工作区行「… / ＋」在触屏下常显，手机上可以重命名、归档、置顶、在工作区新建会话。正文 16px、代码 13.5px；控件最小高度 36px。
安装与启用¶
前提：DSH Web 0.2.1-rc.2（本插件按该版本构建；其他版本可能静默降级成桌面样式）。
方式一：插件市场¶
- 打开插件页的实验性「自定义插件市场」（插件 → 实验性插件 → 更多）；
- 切到「发现」标签，点「添加索引源」，填：
https://kaijia323.github.io/dsh-mobile-ui/index.json
- 找到「移动端外壳」，点安装。
方式二：GitHub 地址¶
- 打开 DSH Web → 左侧栏「插件」→ 右上「添加插件」；
- 输入
github:kaijia323/dsh-mobile-ui； - 点「安装」，装完在插件列表里启用
dsh-mobile-ui。
方式三：本地目录¶
git clone https://github.com/kaijia323/dsh-mobile-ui.git ~/dsh-mobile-ui
然后在「添加插件」里填本地目录路径（例如 /home/you/dsh-mobile-ui）。
验证安装¶
手机宽度（≤ 767px）打开：左上角出现汉堡键、侧栏变成覆盖式抽屉、对话区占满整屏；桌面宽度下布局与原来一致。
卸载 / 临时关闭¶
- 插件列表里禁用
dsh-mobile-ui； - 或地址后加
?dsh-mobile=off临时关闭。
结构说明¶
| 文件 | 作用 |
|---|---|
index.js |
宿主半：webServer.tapIndex 注入 viewport-fit=cover 和首帧前的 data-dsh-mobile 标记 |
client.js |
浏览器半：样式、视口标记、键盘高度、抽屉交互、顶部栏导航键、焦点守卫 |
cordis.patch.yml |
bundle 插入行 |
locale/{zh,en}.json |
插件列表里的标题 / 描述 |
版本锚定与降级¶
抽屉、遮罩、面板底栏使用的是 DSH 自带框架稳定的 data-* 锚点（[data-slot="sidebar"]、[data-slot="main"]、[data-shell-overlay]、[data-sidebar-collapsed]、[data-row-key]），升级后如果结构变了，样式会自动降级成”没有移动层”，不会把桌面端弄坏。设置页、主题块、统计 pill、加号按钮这几处用的是当前构建的哈希类名（.VOzbGW_*、_8HJdBW_*、bOPqQW_*、.uV2eYG_*、._7KE1Ra_*），升级后会静默退回桌面样式。
已知边界¶
- 真机输入法：软键盘的弹出/收起时序、安全区数值，模拟环境量不出来，只能真机确认。
- 真实触屏：滚动惯性、长按这类手势只做了样式预设。
- 半屏以上宽度（768–1023）仍走桌面版（56px 栏），没有平板专用布局。
- 输入条统计与设置页的少数版式依赖当前构建的哈希类名，升级后会静默退回桌面样式。
- 宿主半的 viewport meta 是全局替换的，桌面端也会带
viewport-fit=cover（无视觉影响）。
适用场景¶
适合需要在移动设备上查看、调试 DSH Web 对话的开发者。如果你经常用手机访问 DSH Web，这个插件可以让界面更紧凑、操作更顺手。
生态说明¶
DSH 理念是「一切皆插件」，社区目录是独立站点，与 DeepSeek / 幻方无官方从属关系。
