fix(flow-chat): align status columns and standardize transcript spacing - #2940
Merged
Conversation
Share the 14px icon slot and 4px text gap across public ambient cards, thinking, exploration and the resident runtime row. Remove double opacity and transparent-border offsets. Lab uses real Todo, AgentWait, Skill and terminal cards with state and expansion controls. Validation: design-system:check, check:web, motion inventory and 21 focused thinking/Todo/AgentWait/runtime tests pass. Native desktop existing transcript confirms thinking disclosure and body leading edge. Full mixed-state, theme/density and remote scenarios remain manual pending; no remote runtime tested.
Use 8px item gaps, 4px inline spacing and 22px compact disclosure minimums. Move outer spacing from leaf views to model-round, retry, exploration and subagent compositions; retain continuous collapsed ambient runs across virtual rows. Remove adjacent negative margins and expanded Task margin stacking. Preserve the 24px runtime footer and existing measurement, collapse and viewport owners. Lab: real mixed tool sequence changes between compact runs and spaced expanded cards. Export wrappers retain their own spacing. Validation: design-system:check, check:web, ESLint, motion inventory (zero duplicate keyframes), and 40 tests across seven focused layout/measurement/collapse/rhythm/thinking/subagent files pass. Native Windows existing transcript: thinking expansion/collapse and switching away/back inspected; collapse preserved earlier content position. Live streaming, full mixed history, theme/density and remote scenarios remain manual pending. No remote runtime scenario was exercised; existing scrolling Known Gaps remain outside this change.
kev1n77
force-pushed
the
fmy/ui-main
branch
from
September 10, 2026 03:26
90bfb5d to
970cd19
Compare
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
1 participant
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
Align icons, labels, and content across FlowChat thinking, exploration, ambient tools, and runtime status rows.
Type and Areas
Type: Bug fix / UI/UX
Areas: Web UI, FlowChat, shared tool cards, design tokens, Design Lab, documentation.
Motivation / Impact
Mixed transcript rows previously used different icon slots, insets, opacity multipliers, and margins. This made text columns misalign and spacing vary between thinking, tool calls, and expanded content.
The updated layout keeps status columns consistent and gives each composition ownership of its spacing. Consecutive collapsed ambient tools remain compact, including across model-round boundaries, while expanded cards retain normal section spacing.
Verification
Previously recorded implementation checks passed; they were not rerun when preparing this PR description:
pnpm run design-system:checkpnpm run check:webpnpm --dir src/web-ui run lintpnpm run motion:audit— inventory reviewed; zero duplicate global keyframe names.Horizontal alignment regressions: 4 files, 21 tests passed.
Spacing, collapse, and measurement regressions: 7 files, 40 tests passed.
Native Windows desktop checks covered thinking expansion and collapse in an existing transcript, content alignment, and switching between sessions. Collapsing thinking preserved the position of earlier content in the checked transcript.
Live streaming, complete mixed-history scenarios, and theme/density combinations remain pending.
Reviewer Notes
The runtime status footer retains its 24px height. Existing footer reservation, virtual-item identity, measurement, collapse notifications, and viewport ownership are preserved. No scroll compensation or timer-based layout correction is added.
Lab entry: FlowChat tool gallery → mixed tool sequence.
No backend protocol or persisted-data changes are introduced. Remote workspace, remote control, Peer Device Mode, and Detached Dispatch were not verified end to end. Existing documented FlowChat scrolling gaps remain outside this PR.
Checklist