Skip to content

Make /wordart responsive and fix atlas background warning#52

Merged
apresmoi merged 2 commits into
mainfrom
wordart-responsive
May 31, 2026
Merged

Make /wordart responsive and fix atlas background warning#52
apresmoi merged 2 commits into
mainfrom
wordart-responsive

Conversation

@apresmoi
Copy link
Copy Markdown
Collaborator

Summary

  • make the /wordart composer responsive like /gallery: below 760px the two floating panels collapse into bottom sheets toggled one-at-a-time by a Style / Controls tab bar over a full-bleed stage (desktop keeps both panels floating, unchanged)
  • scope the mobile collapse to .wa-gui:not(.wa-gui--inline) so the left card's own inline lil-gui keeps showing inside the card
  • stop the React atlas leaf from listing the background shorthand alongside the background-* longhands in one inline style object — React warned on every re-render (mixing shorthand/longhand); mirrors the existing Vue renderer fix, vanilla builds a CSS string so is unaffected

Validation

  • pnpm test && pnpm build
  • Playwright at /wordart (390px): tabs toggle each sheet, Style shows text/font/type/color/presets, Controls shows shape/layout/camera/lighting, both clear the tab bar, Esc closes; desktop + 800px keep both panels floating with no tab bar
  • Playwright at /wordart (1366px): shorthand/conflict console warnings drop from hundreds to 0, no other errors

@apresmoi apresmoi merged commit a8adc6b into main May 31, 2026
1 check 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