Some checks are pending
Deploy to Cloudflare Workers (OpenNext) / deploy (push) Waiting to run
Use mainwhite.svg on white sections with curvy green transitions into flat green bands, improve text and button contrast, and deploy via OpenNext on Cloudflare Workers. Co-authored-by: Cursor <cursoragent@cursor.com>
61 lines
1.5 KiB
TypeScript
61 lines
1.5 KiB
TypeScript
import { cn } from "@/lib/utils";
|
|
|
|
type Props = {
|
|
className?: string;
|
|
};
|
|
|
|
/**
|
|
* Curvy contour lines extending from white pattern sections into the green band below.
|
|
*/
|
|
export function TopoCurvyExtend({ className }: Props) {
|
|
return (
|
|
<div
|
|
className={cn(
|
|
"topo-curvy-extend pointer-events-none absolute right-0 bottom-0 left-0 z-[6] h-16 translate-y-[45%] md:h-24 md:translate-y-[40%]",
|
|
className
|
|
)}
|
|
aria-hidden
|
|
>
|
|
<svg
|
|
className="h-full w-full"
|
|
viewBox="0 0 1440 96"
|
|
preserveAspectRatio="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
d="M-40 52 C 180 8, 420 88, 720 44 S 1180 12, 1480 56"
|
|
fill="none"
|
|
stroke="#1a5c38"
|
|
strokeWidth="1.25"
|
|
strokeOpacity="0.42"
|
|
strokeLinecap="round"
|
|
/>
|
|
<path
|
|
d="M-20 68 C 260 92, 520 28, 800 72 S 1220 88, 1500 38"
|
|
fill="none"
|
|
stroke="#1a5c38"
|
|
strokeWidth="1"
|
|
strokeOpacity="0.32"
|
|
strokeLinecap="round"
|
|
/>
|
|
<path
|
|
d="M0 36 C 320 64, 640 16, 960 48 S 1320 76, 1480 28"
|
|
fill="none"
|
|
stroke="#1a5c38"
|
|
strokeWidth="1.5"
|
|
strokeOpacity="0.28"
|
|
strokeLinecap="round"
|
|
/>
|
|
<path
|
|
d="M80 82 C 400 58, 700 94, 1040 62 S 1280 42, 1460 78"
|
|
fill="none"
|
|
stroke="#2d7a52"
|
|
strokeWidth="0.9"
|
|
strokeOpacity="0.38"
|
|
strokeLinecap="round"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
);
|
|
}
|