AnakinCao
dsh-chat-width
DSH Web GUI plugin: adaptive chat content width — the middle area expands with screen resolution (1080p/2K/4K) when side panels are collapsed (injects CSS overriding --dsh-chat-content-width)
- Stars
- 0
- Language
- JavaScript
- Created
- Aug 16, 2026
- Updated
- Aug 16, 2026
Introduction
dsh-chat-width
简体中文: README.zh.md
A small DSH (DeepSeek Harness) Web GUI plugin that makes the chat content column adapt to the screen resolution — when both side panels are collapsed, the middle area no longer stays stuck at the fixed 748px.
What it does
The DSH chat content column is hard-coded to 748px (--dsh-chat-content-width: 748px), so the middle area stays narrow with large empty margins even after both side panels are collapsed. This plugin injects CSS that overrides the width to min(100%, adaptive cap):
- Side panels open → the content column fills the center column exactly;
- Both collapsed → the column grows with the current screen/window resolution, up to the cap;
- Historical user message bubbles follow the same width (overrides the fixed 525px cap);
- The stats row below the input box (the live-stats TPS merge row) follows it too (overrides the fixed 620px cap).
Install
Method 1 — recommended, one command (restart dsh web afterwards):
dsh plugin --profile web add https://github.com/AnakinCao/dsh-chat-width.git
Method 2 — no restart (manual mount): append to ~/.dsh/profiles/web/cordis.patch.yml:
- insert:
- id: dsh-chat-width
name: 'dsh-chat-width'
and place the repository content under ~/.dsh/profiles/web/node_modules/dsh-chat-width/ (or pnpm add), then refresh the page once.
Pick ONE method — never mount twice.
Adaptive rule (default)
max width = min(100%, clamp(900px, 72vw, 2560px))
| Viewport | Content width |
|---|---|
| 1366×768 | ≈983px |
| 1920×1080 | ≈1382px |
| 2560×1440 | ≈1843px |
| 3840×2160 | 2560px (cap) |
Tracks window size changes live — no refresh needed.
Tuning
Edit the three constants at the top of lib/client.js — changes hot-apply via DSH client HMR (~0.5s), no restart / no refresh:
ADAPTIVE_RATIO(default0.72) — fraction of the viewport widthMIN_WIDTH(default"900px") — lower boundMAX_CAP(default"2560px") — upper bound (raise it for 4K+)
Or force a fixed width from the browser console (takes effect after refresh):
localStorage.setItem('dsh-chat-width.max', '1920px') // fixed 1920px
localStorage.removeItem('dsh-chat-width.max') // back to adaptive
A console log line prints the active viewport and width rule on page load.
Uninstall
- Installed via method 1:
dsh plugin --profile web remove dsh-chat-width, then restartdsh web; - Installed via method 2: remove the insert entry from the profile
cordis.patch.ymland delete~/.dsh/profiles/web/node_modules/dsh-chat-width/, then refresh the page.
Compatibility
- Requires the DSH 0.1.0-rc.6 web profile client plugin system (
dsh web,window.__ModuleLoader__bundle format). - Selectors target the conversation root's stable
[data-phase]attribute with doubled specificity, so the override keeps working after the conversation package updates (hashed class names change). - The host half (
lib/index.js) is a no-op placeholder so the loader entry mounts.
License
MIT