From 911f40b91d18e541fd96edc89adc525fd89915dd Mon Sep 17 00:00:00 2001
From: vyshnav <vyshnavravi599@gmail.com>
Date: Thu, 9 May 2024 12:56:37 +0530
Subject: [PATCH] feat: Add Sponser component to display sponsors on the Home
 page

---
 src/components/widgets/GoldSponser.tsx | 61 ++++++++++++++++++++++++++
 1 file changed, 61 insertions(+)
 create mode 100644 src/components/widgets/GoldSponser.tsx

diff --git a/src/components/widgets/GoldSponser.tsx b/src/components/widgets/GoldSponser.tsx
new file mode 100644
index 0000000..2512581
--- /dev/null
+++ b/src/components/widgets/GoldSponser.tsx
@@ -0,0 +1,61 @@
+"use client";
+import Image from "next/image";
+import { CardBody, CardContainer, CardItem } from "@/components/ui/3d-card";
+import { tiaraFont } from "@/lib/fonts";
+import { cn, tiaraAssetsPrefix } from "@/lib/utils";
+
+const sponsers = [
+  `${tiaraAssetsPrefix}/sponsers/ather.jpeg`,
+  `${tiaraAssetsPrefix}/sponsers/kasharp.jpeg`,
+  `${tiaraAssetsPrefix}/sponsers/marian.jpeg`,
+  `${tiaraAssetsPrefix}/sponsers/nidhi_land.jpeg`,
+  `${tiaraAssetsPrefix}/sponsers/pakruti.jpeg`,
+  
+];
+
+
+
+export  function Sponsers() {
+  return (
+    <div className="h-fit">
+      <div className="-ml-5 flex justify-center items-center pt-32 z-50">
+        <div
+          className={cn(
+            "text-4xl xs:text-5xl sm:text-6xl md:text-7xl lg:text-8xl w-fit text-center duration-500",
+            tiaraFont.className
+          )}
+        >
+          <h1 className="text-4xl xs:text-5xl sm:text-6xl md:text-7xl lg:text-8xl">
+            Sponsers
+          </h1>
+        </div>
+      </div>
+      <div className="w-full flex justify-center ">
+        <div className="p-14 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-16">
+          {sponsers.map((card, index) => {
+            return (
+              <CardContainer
+                key={index}
+                containerClassName="relative flex items-center justify-center transition-all duration-200 ease-linear"
+              >
+                <CardBody className="relative">
+                  <CardItem translateZ="100" className="w-full mt-4">
+                    <Image
+                      src={card}
+                      className="rounded-xl "
+                      alt="thumbnail"
+                      width={1200}
+                      height={800}
+                      priority
+                      sizes="(max-width: 640px) 100vw, (max-width: 1023px) 50vw, 33vw"
+                    />
+                  </CardItem>
+                </CardBody>
+              </CardContainer>
+            );
+          })}
+        </div>
+      </div>
+    </div>
+  );
+}