Scroll Advance Project Page
A project template where reaching the bottom is the navigation. The footer pins for three viewports and fills a second progress bar as you push through it; when that bar completes, the page advances to the next project on its own. Two independent progress readouts run at once, one in the nav tracking the whole document and one in the footer tracking only the pin, and a latch stops the handoff firing twice if the pin is scrubbed across its end.
npx shadcn@latest add https://ui.aryank.space/r/scroll-advance-project-page.jsonInstalls from ui.aryank.space. To add it by hand, copy the files in Usage below, or register the @compronents namespace via the docs.
| Prop | Type | Default | Description |
|---|---|---|---|
| projects | ScrollAdvanceProject[] | Three BLANK projects | Slug, title, description, and images per project. The list wraps, so the last hands back to the first. |
| assetBase / initialSlug | string | Blob asset base | Where the default project images load from, and which project to open on. |
projectstextProject slugs, titles, descriptions, and image sets.
gsaplenis