Web UI is not responsive on mobile #7

New issue

Open

opened 2026-10-20 07:55:58 +00:00 by rosa · 0 comments

rosa commented

2026-10-20 07:55:58 +00:00

Member

The web UI is not usable on a phone. Requested by Felix 2026-10-20.

Problem. The layout is desktop-only: fixed-width columns, tables that overflow horizontally, and controls that require precise pointer input. On a phone the Usage/Hosts/Chat pages either scroll sideways or collapse into unreadable columns.

What good looks like

Responsive breakpoints so tables become stacked cards below ~768px.
Sidebar/nav collapses to a drawer on narrow viewports.
Tap targets >=44px; no hover-only affordances (they are unreachable on touch).
Long values (IDs, hashes, paths) wrap or truncate with copy affordance rather than forcing width.

Why it matters beyond convenience. Watching a long training run from a phone is exactly when Felix is away from a desk, and right now he cannot check status on mobile at all — which is part of why every status question becomes a chat message.

Scope note for implementation: Meteor/React app under services/web; the pages that matter most are Usage, Hosts, Chat and the Request Log. A single shared responsive table/card component would cover most of it rather than per-page fixes.

The web UI is not usable on a phone. Requested by Felix 2026-10-20. **Problem.** The layout is desktop-only: fixed-width columns, tables that overflow horizontally, and controls that require precise pointer input. On a phone the Usage/Hosts/Chat pages either scroll sideways or collapse into unreadable columns. **What good looks like** - Responsive breakpoints so tables become stacked cards below ~768px. - Sidebar/nav collapses to a drawer on narrow viewports. - Tap targets >=44px; no hover-only affordances (they are unreachable on touch). - Long values (IDs, hashes, paths) wrap or truncate with copy affordance rather than forcing width. **Why it matters beyond convenience.** Watching a long training run from a phone is exactly when Felix is away from a desk, and right now he cannot check status on mobile at all — which is part of why every status question becomes a chat message. **Scope note for implementation:** Meteor/React app under `services/web`; the pages that matter most are Usage, Hosts, Chat and the Request Log. A single shared responsive table/card component would cover most of it rather than per-page fixes.