Pull requests / #3156

#3156 web: a tool call no longer widens the page on phones (#2971)

open · @ctr-137 · 0 commentaires · Sur GitHub

Server & API

Description

## What it changes

`serve/web/app.css`, three rules:

- `.view` gets `min-width: 0`. As a flex item of `main` it otherwise keeps `min-width: auto`, so its min-content width — raised by a long `nowrap` tool name — makes the whole panel, and the page, wider than the viewport.
- `.tool-call > summary` gets `overflow: hidden`.
- `.tool-call__name` gets `min-width: 0; overflow: hidden; text-overflow: ellipsis`, so the name shrinks and ellipsizes instead of forcing the row wider.

The preview already had the same treatment.

## What it leaves alone

Layout only: no markup, JS or API change, and the desktop layout is unchanged.

## How I checked

Headless Edge (puppeteer-core), the app's own `tokens.css`, `components.css` and `app.css`, and the tool-call markup from `serve/web/app.js`:

| viewport | before | after |
|---|---:|---:|
| 412×915 | `scrollWidth=752` | `412` |
| 390×844 | `752` | `390` |
| 1680×915 | `1680` | `1680` |

With a 442 px tool name, the name ellipsizes (client width 211 at 412 px, 189 at 390 px) and the page still fits; at 1680 px it is shown whole.

Reported by @TitanMamo in #2971, whose root-cause analysis and patch this follows.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Sur le site

Liens install, modèles, releases.