fix(home): stop the desktop home screen clipping, show full tab names

The welcome column was 880px tall inside a 752px overlay on a 1470x842
window, so it ran off both ends (title above the top edge, "Or click Run
to start" below the bottom one) with no way to scroll to either.
.welcome-content is now a flex column bounded at the overlay height with
every child fixed except the Resume list, which shrinks and scrolls
internally. Short windows (<=900px tall) get a tighter rhythm as well, so
the list keeps usable height instead of collapsing to two rows.

The open-tabs rail drops its border-right (the gradient already reads as
docked) and widens 19vw -> 25vw, which stays inside the gutter at the
1180px gate (295px of 310px). The status pill moves from beside the name
down to the created/active stamps line, handing the full row width to the
session name: names render whole instead of ellipsizing
"w34-claudeman: mindreading" into "w34-claudeman: ...", and wrap to a
second line only when they still do not fit.

Verified against the live server with the edited files served into the
page: content fits the overlay at 1180x800 through 2560x1440 and on phone
widths, no clipped names or stamps, no page errors.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Codeman maintainer
2026-08-10 11:34:57 +02:00
parent 752374abc7
commit 0da7f652b4
2 changed files with 107 additions and 17 deletions
+15 -4
View File
@@ -393,10 +393,14 @@ Object.assign(CodemanApp.prototype, {
// that collide with state strings on other surfaces.
pill.setAttribute('data-i18n-skip', '');
pill.textContent = row.pill;
item.appendChild(pill);
// Wraps onto its own line (the row is flex-wrap) so it gets the full width.
item.appendChild(this._buildHomeSessionsMeta(row));
// The stamps line wraps onto its own full-width line (the row is flex-wrap)
// and the pill rides along at its right end, rather than sitting beside the
// name: that hands the whole width of the rail to the session name, which is
// what stops it ellipsizing.
const meta = this._buildHomeSessionsMeta(row);
meta.appendChild(pill);
item.appendChild(meta);
return item;
},
@@ -439,7 +443,14 @@ Object.assign(CodemanApp.prototype, {
pill.className = 'home-sessions-pill home-sessions-pill--web';
pill.setAttribute('data-i18n-skip', '');
pill.textContent = 'web';
item.appendChild(pill);
// Same bottom line as a session row (minus the stamps, a dashboard has
// none), so the pill sits in the same place on every row in the rail.
const foot = document.createElement('span');
foot.className = 'home-sessions-row-meta';
foot.setAttribute('data-i18n-skip', '');
foot.appendChild(pill);
item.appendChild(foot);
return item;
},