Coverflow 12 block design & features
Coverflow12 pairs a cover flow with a filmstrip timeline. Built with shadcn/ui, it shows a centered heading above a row of portrait photographs, the current milestone's title and description, and a ruler-style timeline underneath. The timeline carries a small thumbnail of every milestone above a scale of major and minor ticks with the years printed beneath.
The photos and the timeline share a single position, so they always move together. Dragging the photos sideways scrubs through the years with momentum and rubber-band resistance at the ends, and releasing snaps to the nearest milestone. Pressing anywhere on the ruler and dragging scrubs the same way, with a playhead and a filled progress line following along. The thumbnail under the playhead magnifies and lifts like a dock icon, and the photos regain their color as they reach the center while the rest fade toward grayscale.
It reads as archival and tactile, well suited to company histories, product timelines, and anniversaries. Clicking a photo or thumbnail jumps to it, and the timeline works with the arrow, Home, and End keys. It needs an image, year, title, and one-line description for each milestone.
On narrow screens every other year label is hidden so the scale stays legible.