feat(partners): implement partners page

Author: eric15342335

src/app/about-us/partners/page.tsx

@@ -1,10 +1,49 @@
 import { Metadata } from "next";
-import { ComingSoon, comingSoonText } from "@/components/sections/coming-soon";
+import Image from "next/image";
 import { buildPageMetadata } from "@/lib/config";
+import { partners } from "@/lib/partners";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
 
-const description = comingSoonText;
+const description =
+  "We are collaborating with the following partners to share the message of peace and humanity.";
 export const metadata: Metadata = buildPageMetadata("/about-us/partners", { description });
 
 export default function Partners() {
-  return <ComingSoon />;
+  return (
+    <section className="flex min-h-[85vh] flex-col items-center justify-center gap-4 text-center m-auto w-fit">
+      <h1 className="text-4xl font-bold tracking-tight">Partners</h1>
+      <p className="text-lg text-muted-foreground max-w-2xl">{description}</p>
+      <div className="mt-6 flex flex-col items-center gap-4 w-full">
+        {partners.map((partner) => (
+          <a
+            key={partner.name}
+            href={partner.href}
+            target="_blank"
+            rel="noopener"
+          >
+            <Card className="h-full">
+              <CardHeader className="text-center">
+                {partner.logo && (
+                  <div className="relative w-16 h-16 mx-auto">
+                    <Image
+                      src={partner.logo}
+                      alt={`${partner.name} logo`}
+                      fill
+                      className="object-contain"
+                      unoptimized
+                    />
+                  </div>
+                )}
+                <CardTitle>{partner.name}</CardTitle>
+                <CardDescription>{partner.description}</CardDescription>
+              </CardHeader>
+              <CardContent>
+                <p className="text-sm text-muted-foreground">{partner.href}</p>
+              </CardContent>
+            </Card>
+          </a>
+        ))}
+      </div>
+    </section>
+  );
 }

src/lib/partners.ts

@@ -0,0 +1,15 @@
+export type Partner = {
+  name: string;
+  description: string;
+  href: string;
+  logo?: string;
+};
+
+export const partners: Partner[] = [
+  {
+    name: "ALPHA Education",
+    description: "Parent Organization",
+    href: "https://www.alphaeducation.org",
+    logo: "https://static.wixstatic.com/media/5728d8_7391e4ddfa584943a7057e629aeef881~mv2.png/v1/fill/w_406,h_176,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Logo(Menu)-01.png",
+  },
+];