Interleaved About

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its media-slot dependencies and any missing npm packages, and installs them straight into your project.

Prefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/about/about40.tsx instead.

Usage

The file also exports about40Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.

import { About40, about40Demo } from "@/components/blocks/about/about40";

export default function Page() {
  return <About40 {...about40Demo} />;
}

Props

Types

type Entry = {
  paragraph: string;
  image: MediaSlotImage;
};

Behavior notes

• Each entry is an independent paragraph/image pair rather than one shared image pool, unlike About40's sibling About6 which pairs a single description column against a list of numbered principles.
• Image placement alternates by index (odd entries flip the image to the right column via an order utility) and each image gets an opposite vertical nudge (-mt-6 vs mt-10), producing the staggered magazine rhythm the brief calls for, without any JS or scroll-triggered animation.
• Unlike About13 or About37 which use a single portrait per section, this block expects a full array of entries and repeats the text/image unit down the page, closer to a long-form editorial article than a single hero split.