Award List
A hover-reactive list of accolades: each row is a three-state shutter that slides to reveal the project credit, settling up or down by exit edge, while the hovered row's image lands on a stacking preview pile in the corner that collapses on pause and clears on leave. GSAP + Lenis.
npx shadcn@latest add https://ui.aryank.space/r/award-list.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 |
|---|---|---|---|
| awards | Award[] | 17 sample awards | Rows of { name, type, project, label, image }; image lands on the preview pile. |
| heading | string | "Recognition and awards" | Label above the list. Pass empty string to hide. |
| nameBackground | string | "#e3e3db" | Resting name-row background. |
| nameColor | string | "#000000" | Resting name-row text color. |
| projectBackground | string | "#000000" | Hover project-band background. |
| projectColor | string | "#e3e3db" | Hover project-band text color. |
| embedded | boolean | true | Own an internal scroll container (true) or use the window scroll (false). |
nameBackground / nameColorcolorResting name-row surface and ink.
projectBackground / projectColorcolorThe inverted project band revealed on hover.
awardsasset-urlEach row's name, credit, and image — hosted through https://ui.aryank.space/assets/award-list/img1.jpg and the numbered set.
gsaplenis