← shotcowboystyle All experiments
  1. Window Licker
  2. Liquid Glass Widgets
  3. Elastic Accordion
  4. Hold to Delete Button
  5. Morph Surface
  6. Siri Orb
  7. Split Button
  8. Staggered Text
  9. Gooey Cursor Highlight
  10. Stats Widget
  11. Infinity
  12. Carousel
  13. CSS-Only Toggle
  14. Cyclic Sentence Circle
  15. Electric Bento Grid
  16. Fanning Folder
  17. Immature Responsive Design
  18. Profile Card
  19. Bottom Sheet
Experiments Bottom Sheet

Bottom Sheet

Bottom sheet that resizes as you move between stages

A wallet sheet built on Vaul. It opens on a short options menu, and from there the recovery phrase, private key or remove step each grow or shrink the sheet to fit. Drag down to dismiss.

Each stage hard-codes its height, 290px for the menu and 465 for the recovery phrase. Animating to a height measured after render jumps on the first frame: the sheet has to be wrong once before it can know what is right.