About With Stats Band

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its button, 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/about33.tsx instead.

Usage

The file also exports about33Demo, 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 { About33, about33Demo } from "@/components/blocks/about/about33";

export default function Page() {
  return <About33 {...about33Demo} />;
}

Props

Types

type ReadMoreLink = { label: string; href: string };

type StatItem = { title: string; value: string };

Behavior notes

• Unlike About14, which puts its stats band at the top above a centered story card, About33 puts the stats band at the bottom, below an asymmetric two-column header instead of a centered one.
• readMore renders as a Button with variant "link" rather than the default/outline buttons every other About block uses for its buttons array, since it is meant to read as inline text, not a CTA.
• The right column's two images sit beside each other under a single shared heading, unlike About33's sibling About32, which gives its two images the full section width with no accompanying text column.