Projects & work
Projects Contents
Case cards stacked under a split heading — results, a timeline, tags and four photos each — with a sticky index beside them that follows the scroll.
Layout and motion from the KorDent template — see it in contextTry it in the page builderBlocks come with Pro and Ultimate
Preview every block now, in any theme and at any width. The source, the install command and your registry token come with a Pro or Ultimate plan.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| label / title / lead | string | — | The heading at the left and the lead at the right from 768px; an empty label or lead is left out. |
| projects | { id, name?, category, title, text, resultsTitle?, results?, timelineTitle?, timeline?, tags?, images }[] | 3 cases | The cards. id is what the index links to; name is the index's short name (the title when left out); images are four photos. |
| indexLabel | string | "Case studies on this page" | The index's name, for screen readers. |
| className | string | — | Classes for the <section>. |
- From 1024px the index (300px, sticky 50px from the top) marks the case whose card crosses the top third of the window — the primary colour and an arrow — and a click scrolls smoothly to it (Framebrick UI contents-nav, line="third"; a jump with reduced motion). Below 1024px there is no index.
- Each card rises 18px into place once, when half of it is in view (scroll-reveal trigger="enter"; KorDent's 1s tween becomes the component's spring); still with reduced motion.
- Dropped from KorDent: its stone band, teal category and panel, and Phosphor icons; the panel's secondary text is at 65% of the text colour.
