svelte-popup-layout Svelte Themes

Svelte Popup Layout

Layout with base and popup layer

Svelte Popup Layout

This Svelte project provides a layout with a base layer and a popup layer. The popup layer slides up from the bottom and can be closed by either dragging down a handle bar or clicking on a semi-transparent overlay.

Features

  • Toggleable popup with slide animation.
  • Draggable handle bar to close the popup.
  • Clickable overlay to close the popup.
  • Scrollable content area within the popup.
  • Fixed action bar at the bottom of the popup for action buttons.

Setup

  1. Clone the repository: git clone https://github.com/jaensen/svelte-popup-layout.git
  2. Install dependencies: npm install
  3. Start the project: npm run dev

Usage

To toggle the popup, click the "Toggle popup" button. To close the popup, either click on the overlay, or drag the handle bar at the top of the popup downwards.

License

MIT

Top categories

Loading Svelte Themes