fix(mobile-web): unify transcript card spacing and collapsed heights - #3216
Merged
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Unify mobile chat task/tool cards and todo cards with 12px corners, 12px horizontal padding, aligned icon/text columns, and 48px collapsed row heights including borders. Add space between consecutive cards and soften error outlines so failed tasks do not dominate the transcript.
Todo headers now remain left-aligned, retain a label when expanded or idle, and expose their expanded state and associated list to assistive technology. Bound progress dots and agent labels on narrow screens, preserve visible keyboard focus, and respect reduced motion for activity indicators.
Type and Areas
Type: Bug fix / UI/UX
Areas: Mobile web chat transcript
Motivation / Impact
Transcript overrides previously removed all horizontal padding and reduced rows to 36px, while prominent task cards independently used 16px corners. Icons touched card edges, adjacent failures crowded together, and todo/task/disclosure rows had inconsistent geometry. These changes establish consistent spacing and collapsed heights using existing theme tokens.
Verification
Passed:
pnpm --dir src/mobile-web run test:ui-components(15 tests)pnpm --dir src/mobile-web run type-checkpnpm run theme:color-audit:allpnpm run build:mobile-web(existing large-chunk warning)git diff --checkManual visual checks in the Codex in-app browser using the actual React transcript components with synthetic host payloads: 320/375/414/768px layouts, dark/light themes, todo expansion, keyboard focus, and running/completed/failed/pending task presentation. Browser geometry inspection confirmed 48px collapsed todo, task, thinking, and grouped-read rows. The temporary preview files are excluded from the PR.
Reviewer Notes
Presentation-only changes; no transport, persisted data, or protocol changes. Remote control rendering was exercised locally with synthetic payloads, not an actual connected remote host. Remote workspace, live remote control, Peer Device Mode, and Detached Dispatch were not exercised end to end.
Checklist