Hero (split) module

A generic 2-column layout with richtext + an asset (responsive image, code block or custom HTML).

Pretitle

Hero (Split)

with responsive image on left (toggle dark mode!)

src/ui/modules/HeroSplit.tsx

type HeroSplitProps = Partial<{
	pretitle: string
	content: any
	ctas: Sanity.CTA[]
	assets: Array<Sanity.Img | Sanity.Code | Sanity.CustomHTML>
	assetOnRight: boolean
	assetBelowContent: boolean
}>

Pretitle

Hero (Split)

with code block on right

Call-to-action Call-to-action

Hero (split) module

Hero (Split)

Hero (Split)

Sanity schema¶

Next.js code¶