dsh-chat-width

Readme

# dsh-chat-width

> 简体中文: [README.zh.md](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):

```bash
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`:

```yaml
- 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` (default `0.72`) — fraction of the viewport width
- `MIN_WIDTH` (default `"900px"`) — lower bound
- `MAX_CAP` (default `"2560px"`) — upper bound (raise it for 4K+)

Or force a fixed width from the browser console (takes effect after refresh):

```js
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 restart `dsh web`;
- Installed via method 2: remove the insert entry from the profile `cordis.patch.yml` and 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