前言¶
DSH Web GUI 的聊天显示区宽度由 CSS 变量 --dsh-chat-content-width 决定,出厂值硬编码为 748px。聊天列、输入框、提问卡片都消费这个变量;在宽屏窗口下,内容区会显得偏窄。
LessXi/dsh-fluid-width 针对这个问题,把该变量覆盖为 min(100%, 2000px):显示区随窗口流动,默认保留 2000px 封顶,也可以改成完全流式。
这是什么¶
LessXi/dsh-fluid-width 是面向 DSH Web GUI 的布局插件,由 LessXi 维护,许可证为 MIT。
它运行在 dsh web 的 client 半区,调整聊天显示区宽度;插件没有 host 职责。
核心功能¶
- 将 CSS 变量
--dsh-chat-content-width覆盖为min(100%, 2000px)。 - 聊天列、输入框、提问卡片自动跟随宽度。
- 侧边栏和右侧面板宽度不受影响。
- 静态覆盖与
MutationObserver版本无关重写互为兜底。 - 零依赖且无
prepare构建脚本。 - 可自定义
MAX_WIDTH_PX,也可改为100%以完全流式。
安装与启用¶
执行:
dsh plugin --profile web add github:LessXi/dsh-fluid-width
该插件零依赖且无 prepare 构建脚本,安装后不需要手动构建。启用步骤:
1、重启 dsh web。
2、刷新浏览器页面。
3、打开任意会话,缩小/拉宽浏览器窗口,聊天内容应随窗口伸缩。
典型用法¶
默认使用¶
安装后默认宽度约束为 min(100%, 2000px):窗口变宽时内容区扩大,超过 2000px 时保留封顶。
调整宽度上限¶
编辑 lib/client.js 顶部的常量:
const MAX_WIDTH_PX = 2000;
可按需要调整:
- 改成
100%(连同上面的拼接)可完全流式,无任何封顶。 - 改小(如
1200)可让内容重新收敛。
卸载¶
执行:
dsh plugin --profile web remove dsh-fluid-width
然后重启 dsh web。
适用场景与注意¶
适合使用 dsh web、希望聊天显示区更贴合窗口宽度的用户。
需要注意:
- 静态覆盖依赖当前版本 conversation 根节点的 CSS class(
.hlCKXq_root)。 - 若 DSH 升级后该 class 变化,且官方样式改用非
px字面量定义,两条路径都失效时,把ROOT_CLASS更新为新的 class 即可。 - 本仓库按 DSH bundle 契约分发(
dsh.bundle.patch→cordis.patch.yml),无需手动编辑 profile 的cordis.patch.yml。 - 插件以当前
dsh进程权限运行,安装前应检查源码与许可证。
结尾¶
LessXi/dsh-fluid-width 的价值,是把 DSH Web GUI 的聊天显示区从固定宽度改为自适应宽度:默认 min(100%, 2000px),可按需改为完全流式或更小上限。
- DSH 社区目录页:按名称
dsh-fluid-width检索(独立站点,非官方应用商店) - GitHub:https://github.com/LessXi/dsh-fluid-width