Repository navigation
fix(web): unify responsive layouts and control sizing - #220
Merged
Merged
Conversation
Share the workspace canvas, workflow columns, toolbars, settings rows, and form fields so page content follows consistent alignment rules. Centralize control sizing and distinguish single-line actions from multiline choices. Reflow split views by content width, bound Media results, paginate Term maps with full-map search, and keep mobile keyboard focus clear of fixed navigation. Add synthetic rendered-layout checks and shared-control invariants, and document layout ownership in the design skill.
Allow Job detail actions to wrap and shorten German batch and history cleanup labels so single-line buttons fit narrow screens. Extend the rendered-layout matrix to 320px and 360px, and wait for data-dependent content before checking populated routes.
Add the layout test command beside the regular test suites, including its local Web server and Agent Browser prerequisites. Point to the design skill for detailed visual verification requirements.
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
Share control sizing and repeated layout patterns across Translate, Jobs, and Settings. Page-specific rules were causing cramped split views, wrapped action labels, and misaligned toolbars at intermediate and mobile widths.
Layout regression coverage
Add an opt-in Agent Browser layout matrix using synthetic API responses. It checks rendered control bounds, action text clipping, alignment, overflow, and focus visibility across Chinese and German, eight viewport widths starting at 320px, themes, and resource states. Populated routes wait for their data-dependent content before inspection. Run it against a local Web server with
pnpm --dir web test:layout <local-web-url>.Extend the density checks to reject page-level overrides of shared control sizing, add Term map pagination and full-content behavior coverage, and update the design skill with layout ownership and rendered-layout inspection requirements.