Skip to content

feat: mobile slide-in drawers for sidebar and inspector panels#46

Merged
CristianEdwards merged 1 commit into
mainfrom
Release
Mar 22, 2026
Merged

feat: mobile slide-in drawers for sidebar and inspector panels#46
CristianEdwards merged 1 commit into
mainfrom
Release

Conversation

@CristianEdwards
Copy link
Copy Markdown
Owner

On screens <=1100px, sidebar and inspector panels now appear as slide-in overlay drawers instead of being hidden with display:none.

Changes:

  • AppShell.tsx — Added toggle state and floating buttons (panel icon for sidebar, panel icon for inspector) that are only visible on mobile. A backdrop overlay allows dismissing by tapping outside.
  • globals.css — Replaced display:none with fixed-position slide-in panels using CSS transform transitions. Added toggle button styles, backdrop overlay, and desktop hide rules.

Behavior:

  • Bottom-left button toggles the shape palette (sidebar)
  • Bottom-right button toggles the inspector panel
  • Tapping the backdrop closes the active panel
  • Canvas remains fully usable when panels are closed
  • Panels overlay the canvas (don't push layout)

On screens <=1100px, sidebar and inspector panels now appear as
slide-in overlay drawers instead of being hidden. Floating toggle
buttons (bottom-left for sidebar, bottom-right for inspector) open
each panel. A backdrop overlay allows dismissing with a tap.
@CristianEdwards CristianEdwards merged commit bd3318a into main Mar 22, 2026
4 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