Component
PhotoRow
Explicit-height horizontal flex row for the gallery. Each child takes a flex ratio. Triggers a left-to-right clip-path reveal on scroll via Framer Motion.
Structure
GalleryRow is the Framer Motion wrapper in apps/web/components/gallery-row.tsx. It sets whileInView="visible" and staggerChildren: 0.3 so each ParallaxCard child reveals left→right.
tsx
import { GalleryRow } from '@/components/gallery-row'
import { ParallaxCard } from '@/components/parallax-card'
// Wide + Narrow row (62 / 38 split)
<GalleryRow height="300px">
<ParallaxCard flex={62}>...</ParallaxCard>
<ParallaxCard flex={38}>...</ParallaxCard>
</GalleryRow>Row layouts used on homepage
R1Wide + Narrow
300px62 / 38R2Three equal
260px33 / 33 / 33R3Full-width
420px100R4Narrow + Wide
300px38 / 62R5Four equal
240px25 / 25 / 25 / 25R6Two equal
340px50 / 50R7Three varied
260px45 / 30 / 25R8Full-width
380px100Props (GalleryRow)
| Prop | Type | Default | Description |
|---|---|---|---|
| height | string | — | CSS height value applied to the row — e.g. "300px". |
| children | ReactNode | — | ParallaxCard children. |