前言¶

在 DSH Web GUI 中，当侧边栏折叠时，中间聊天列的宽度被硬编码为 748px (--dsh-chat-content-width: 748px)。这导致在大屏幕上出现不必要的空白边距。此外，历史消息气泡和统计行也有固定的宽度限制（525px 和 620px）。dsh-chat-width 插件通过注入覆盖这些 CSS 变量的 CSS 解决了这个问题。

插件介绍¶

这是一个 DSH Web GUI 插件，由 AnakinCao 维护。它使聊天内容列适应屏幕分辨率，解决了侧边栏折叠时宽度保持固定的痛点。

功能特性¶

• 屏幕自适应：使聊天内容列适应屏幕分辨率（从 748px 变宽）。
• 侧边栏折叠处理：当侧边栏折叠时，扩展中间区域。
• CSS 变量覆盖：覆盖 CSS 变量 --dsh-chat-content-width。
• 布局扩展：覆盖历史消息气泡固定宽度限制（525px）和统计行固定宽度限制（620px）。
• 动态调整规则：默认规则为 max width = min(100%, clamp(900px, 72vw, 2560px))。

安装¶

推荐使用以下命令安装：

dsh plugin --profile web add https://github.com/AnakinCao/dsh-chat-width.git

安装后请重启 dsh web。

如果需要不重启的方式，可以手动挂载：
1. 在 ~/.dsh/profiles/web/cordis.patch.yml 中追加以下内容：

- insert:
    - id: dsh-chat-width
      name: 'dsh-chat-width'

2. 将仓库内容放置在 ~/.dsh/profiles/web/node_modules/dsh-chat-width/ 下。

请选择一种安装方法，不要重复挂载。

使用方法¶

插件提供了两种调整宽度的方式。

代码调整¶

编辑 lib/client.js 顶部的三个常量。DSH 客户端 HMR 会热更新更改（约 0.5 秒），无需重启：

• ADAPTIVE_RATIO（默认 0.72）——视口宽度的比例
• MIN_WIDTH（默认 "900px"）——下限
• MAX_CAP（默认 "2560px"）——上限（4K+ 可提高此值）

控制台调整¶

也可以从浏览器控制台强制设置固定宽度（刷新后生效）：

localStorage.setItem('dsh-chat-width.max', '1920px') // 固定 1920px
localStorage.removeItem('dsh-chat-width.max')        // 恢复自适应

页面加载时，控制台会打印当前视口和宽度规则。

注意事项¶

• 依赖环境：需要 DSH 0.1.0-rc.6 web profile client plugin system。
• 选择器兼容性：使用 [data-phase] 选择器以确保在对话包更新（哈希类名变更）后依然有效。
• 入口文件：主入口 lib/index.js 是一个占位符，由加载器挂载。
• 许可证：MIT。
• 生态说明：本插件与 DeepSeek 或幻方无官方从属关系，仅作为社区目录中的独立项目存在。

总结¶

该插件解决了 DSH Web GUI 在大屏幕下布局不紧凑的问题，通过动态计算宽度，让界面在不同分辨率下都能获得更好的利用率。