diff --git a/pledge-now-pay-later/src/app/for/_components/index.tsx b/pledge-now-pay-later/src/app/for/_components/index.tsx new file mode 100644 index 0000000..4973836 --- /dev/null +++ b/pledge-now-pay-later/src/app/for/_components/index.tsx @@ -0,0 +1,99 @@ +import Link from "next/link" + +/* ── Nav ── */ +export function Nav() { + return ( +
+
+ +
+ P +
+ Pledge Now, Pay Later + +
+ Sign In + Get Started +
+
+
+ ) +} + +/* ── Footer ── */ +export function Footer({ active }: { active?: string }) { + const links = [ + { href: "/for/charities", label: "Charities" }, + { href: "/for/fundraisers", label: "Fundraisers" }, + { href: "/for/volunteers", label: "Volunteers" }, + { href: "/for/organisations", label: "Organisations" }, + ] + return ( + + ) +} + +/* ── Bottom CTA ── */ +export function BottomCta({ headline, sub }: { headline?: string; sub?: string }) { + return ( +
+
+

+ {headline || "Every day without this, you're losing pledges."} +

+

+ {sub || "Free forever. Two-minute setup. Works tonight."} +

+
+ + Create free account + + + See live demo + +
+
+
+ ) +} + +/* ── Image Placeholder ── */ +export function ImagePlaceholder({ aspect = "video", label }: { aspect?: "video" | "square" | "wide"; label?: string }) { + const aspectClass = aspect === "square" ? "aspect-square" : aspect === "wide" ? "aspect-[2/1]" : "aspect-video" + return ( +
+ {label && ( +
+
+ + + +
+

{label}

+
+ )} +
+ ) +} diff --git a/pledge-now-pay-later/src/app/for/charities/page.tsx b/pledge-now-pay-later/src/app/for/charities/page.tsx index a248699..eaf45db 100644 --- a/pledge-now-pay-later/src/app/for/charities/page.tsx +++ b/pledge-now-pay-later/src/app/for/charities/page.tsx @@ -1,4 +1,5 @@ import Link from "next/link" +import { Nav, Footer, BottomCta, ImagePlaceholder } from "../_components" export default function ForCharitiesPage() { return ( @@ -6,101 +7,94 @@ export default function ForCharitiesPage() {