Skip to content

fix(ui): align form labels and grouped surfaces - #2909

Merged
kev1n77 merged 1 commit into
GCWing:mainfrom
kev1n77:fmy/ui-main
Sep 9, 2026
Merged

kev1n77 merged 1 commit into
GCWing:mainfrom
kev1n77:fmy/ui-main

Conversation

@kev1n77

@kev1n77 kev1n77 commented Sep 9, 2026

Copy link
Copy Markdown
Collaborator

Summary

  • Use 13px semibold labels for horizontal fields and 11px regular labels for vertical fields.
  • Align field helpers and section descriptions with their intended color roles and 16px default line height.
  • Add a dedicated grouped-form background token with a 3% black tint in light mode.
  • Apply the shared styles to settings forms and the new-workspace dialog, and add a Design Lab typography example.

Type and Areas

Type: Bug fix / UI/UX

Areas: Design system, Web UI, Appearance themes, Design Lab

Motivation / Impact

Form labels previously used the same typography regardless of orientation, while helper text and section descriptions lacked the intended visual hierarchy. Grouped forms also inherited an opaque container background.

This change makes form typography and grouped surfaces consistent with the design specifications across shared components and product forms.

Verification

The original implementation passed:

  • pnpm run design-system:check
  • pnpm run check:web, including theme audits and TypeScript checks
  • 18 focused Appearance regression tests, including legacy token compatibility and serialization round trips

These results apply to the original commit; checks have not been rerun on the current cherry-picked revision.

Manual review locations: Design Lab → Patterns → form typography, product settings, and the new-workspace dialog. Full theme, density, narrow-window, and remote-scenario verification remains pending.

Reviewer Notes

Legacy Appearance packages retain their existing grouped-surface overrides unless they explicitly provide the new token. Compatibility applies to both root and chrome scopes.

No backend protocol or persisted schema changes are introduced. Generated theme CSS is updated from its source tokens.

Checklist

  • This PR is focused and does not include secrets, temporary prompts, generated scratch files, or unrelated artifacts.
  • Relevant verification is recorded above, or skipped checks are explained.
  • User-facing strings, docs, and locales are updated where applicable.

@kev1n77
kev1n77 merged commit 5cd4b82 into GCWing:main Sep 9, 2026
13 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant