Skip to content

Commit

Permalink
Implement collapsible sidebar with smooth animation
Browse files Browse the repository at this point in the history
The connection indicator was moved to the right so that it always remains
visible everything else is collapsed, when pressing the new menu button.
A few places use slightly different spacing to making everything work.

Unfortunately, Chakra does not provide a “Horizontal Collapsible” component
(only a vertical collapsible and an horizontal overlay drawer), so a DIY approach
inspired by https://v2.chakra-ui.com/community/recipes/horizontal-collapse was
needed by to implement this with nice animations.

Updates to React 18 + Chakra 2 + Framer-Motion 11, since animation support
needs a newer Framer-Motion version which pulls in newer React which again
is only supported by newer Chakra.

Fixes ekzhang#61
  • Loading branch information
ntninja committed Jul 20, 2024
1 parent e2daf85 commit 46378ae
Show file tree
Hide file tree
Showing 3 changed files with 1,380 additions and 1,069 deletions.
Loading

0 comments on commit 46378ae

Please sign in to comment.