efa48f6f6b
Some checks are pending
Deploy to Cloudflare Workers (OpenNext) / deploy (push) Waiting to run
Limit mainwhite pattern to the landing hero and a bottom footer band; remove it from sections and page headers. Add vertical water-flow animation and stronger hero particles with hover boost. Fix green text on white sections and card descriptions in green bands, including the two-days program cards. Co-authored-by: Cursor <cursoragent@cursor.com>
66 lines
1.8 KiB
TypeScript
66 lines
1.8 KiB
TypeScript
import type { ReactNode } from "react";
|
|
import { TopoCurvyExtend } from "@/components/brand/TopoCurvyExtend";
|
|
import { TopoProseSurface } from "@/components/layout/TopoProseSurface";
|
|
import { TopoSectionProvider } from "@/components/layout/TopoSectionContext";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
export type PageRiftHeaderVariant =
|
|
| "program"
|
|
| "lineup"
|
|
| "partners"
|
|
| "pitch"
|
|
| "exhibit"
|
|
| "sponsor"
|
|
| "tickets"
|
|
| "minimal";
|
|
|
|
type Props = {
|
|
variant: PageRiftHeaderVariant;
|
|
profilePath?: string;
|
|
eyebrow?: string;
|
|
title: ReactNode;
|
|
description?: ReactNode;
|
|
children?: ReactNode;
|
|
className?: string;
|
|
};
|
|
|
|
export function PageRiftHeader({
|
|
variant,
|
|
profilePath,
|
|
eyebrow,
|
|
title,
|
|
description,
|
|
children,
|
|
className,
|
|
}: Props) {
|
|
void variant;
|
|
void profilePath;
|
|
|
|
return (
|
|
<header
|
|
className={cn(
|
|
"section-white group/topo-section relative isolate min-h-[220px] overflow-x-hidden overflow-y-visible border-b border-[#1a5c38]/10 bg-white pt-24 pb-10 md:min-h-[260px] md:pb-12",
|
|
className
|
|
)}
|
|
>
|
|
<TopoCurvyExtend />
|
|
<TopoSectionProvider tone="light">
|
|
<div className="topo-content-layer topo-content-readable relative z-10 mx-auto max-w-6xl px-4 pt-4 md:px-6">
|
|
<TopoProseSurface className="max-w-3xl">
|
|
{eyebrow && (
|
|
<p className="text-xs font-semibold uppercase tracking-widest text-[#ffb300]">
|
|
{eyebrow}
|
|
</p>
|
|
)}
|
|
<div className="mt-3">{title}</div>
|
|
{description && (
|
|
<div className="mt-4 text-[#3d5248] leading-relaxed">{description}</div>
|
|
)}
|
|
</TopoProseSurface>
|
|
{children && <div className="relative z-[15] mt-8">{children}</div>}
|
|
</div>
|
|
</TopoSectionProvider>
|
|
</header>
|
|
);
|
|
}
|