From eabf69c2451a25d7cae008197c11a7ead64f4715 Mon Sep 17 00:00:00 2001
From: Thekal33d <jimohkhalid16@gmail.com>
Date: Fri, 30 May 2025 22:21:03 +0100
Subject: [PATCH 1/3] build banner

---
 components/dashboard-components/Banner.tsx |  19 +++++++++++++++++++
 public/users-avatar.png                    | Bin 0 -> 10505 bytes
 2 files changed, 19 insertions(+)
 create mode 100644 components/dashboard-components/Banner.tsx
 create mode 100644 public/users-avatar.png

diff --git a/components/dashboard-components/Banner.tsx b/components/dashboard-components/Banner.tsx
new file mode 100644
index 0000000..2585e27
--- /dev/null
+++ b/components/dashboard-components/Banner.tsx
@@ -0,0 +1,19 @@
+interface JoinBannerProps {
+    date: string;
+}
+
+const Banner = ({ date }: JoinBannerProps) => {
+    return (
+        <div className="flex justify-between w-full">
+            <div className="flex space-x-3 items-center w-full">
+                <img src="/users-avatar.png" alt="" />
+                <p className="text-xl text-[#988C8C]">{date}</p>
+            </div>
+            <button className="bg-[#EBFFCB] text-[#70750B] w-[126px] py-2 rounded">
+                Join
+            </button>
+        </div>
+    );
+};
+
+export default Banner;
diff --git a/public/users-avatar.png b/public/users-avatar.png
new file mode 100644
index 0000000000000000000000000000000000000000..b3b85a437c237ad20ba67b6b251a1f5f8daaa834
GIT binary patch
literal 10505
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
LNkvXXu0mjf-pXqy

literal 0
HcmV?d00001


From 18839a9e3a8bbfc506b2c0ab0a5b46cafac4196e Mon Sep 17 00:00:00 2001
From: Thekal33d <jimohkhalid16@gmail.com>
Date: Fri, 30 May 2025 22:25:11 +0100
Subject: [PATCH 2/3] add campaign banner

---
 .../dashboard-components/BannerCampaign.tsx   | 79 +++++++++++++++++++
 1 file changed, 79 insertions(+)
 create mode 100644 components/dashboard-components/BannerCampaign.tsx

diff --git a/components/dashboard-components/BannerCampaign.tsx b/components/dashboard-components/BannerCampaign.tsx
new file mode 100644
index 0000000..83dba58
--- /dev/null
+++ b/components/dashboard-components/BannerCampaign.tsx
@@ -0,0 +1,79 @@
+interface CampaignBannerProps {
+    otherBg?: string;
+    title: string;
+    icon: string;
+    owner: string;
+    shareLink: string;
+    telegramLink: string;
+    xLink: string;
+}
+
+const BannerCampaign = ({
+    otherBg,
+    title,
+    icon,
+    owner,
+    shareLink,
+    telegramLink,
+    xLink,
+}: CampaignBannerProps) => {
+    return (
+        <div
+            className={
+                !otherBg
+                    ? `h-32 nft-pattern bg-cover bg-center bg-no-repeat rounded border border-[#988C8C]`
+                    : `h-32 bg-cover bg-center bg-no-repeat rounded border border-[#988C8C] ${otherBg}`
+            }
+        >
+            <div className="bg-black/50 h-full px-12 py-10 flex justify-between items-center">
+                <div>
+                    <h1 className="text-[34px] font-bold">{title}</h1>
+                    <p className="text-[16px] text-[#B2A9A9]">
+                        Curated by <img src={icon} alt="" className="inline" />{" "}
+                        {owner}
+                    </p>
+                </div>
+                <div>
+                    <p>Share : </p>
+                    <div className="flex space-x-4">
+                        <a
+                            href={shareLink}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                        >
+                            <img
+                                src="/share-icon.svg"
+                                alt="share"
+                                className="w-6 h-6"
+                            />
+                        </a>
+                        <a
+                            href={telegramLink}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                        >
+                            <img
+                                src="/telegram.svg"
+                                alt="telegram"
+                                className="w-6 h-6"
+                            />
+                        </a>
+                        <a
+                            href={xLink}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                        >
+                            <img
+                                src="/twitter.svg"
+                                alt="X"
+                                className="w-6 h-6"
+                            />
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    );
+};
+
+export default BannerCampaign;

From 7e5e0c52925d64480acc07a55b3740621db7e417 Mon Sep 17 00:00:00 2001
From: Thekal33d <jimohkhalid16@gmail.com>
Date: Fri, 30 May 2025 22:29:13 +0100
Subject: [PATCH 3/3] round up Cmpain details page

---
 components/pages/CampaignDetailsPage.tsx | 105 +++++++++++++++++++++++
 public/coiton-logo.png                   | Bin 0 -> 876 bytes
 public/share-icon.svg                    |   5 ++
 public/telegram.svg                      |  15 ++++
 public/twitter.svg                       |   3 +
 5 files changed, 128 insertions(+)
 create mode 100644 components/pages/CampaignDetailsPage.tsx
 create mode 100644 public/coiton-logo.png
 create mode 100644 public/share-icon.svg
 create mode 100644 public/telegram.svg
 create mode 100644 public/twitter.svg

diff --git a/components/pages/CampaignDetailsPage.tsx b/components/pages/CampaignDetailsPage.tsx
new file mode 100644
index 0000000..1ef918c
--- /dev/null
+++ b/components/pages/CampaignDetailsPage.tsx
@@ -0,0 +1,105 @@
+import { useState } from "react";
+import Banner from "../dashboard-components/Banner";
+import BannerCampaign from "../dashboard-components/BannerCampaign";
+
+const CampaignDetails = () => {
+    return (
+        <div className="px-18 py-16 flex flex-col space-y-4">
+            <BannerCampaign
+                title="Early NFT Collector"
+                icon={"/coiton-logo.png"}
+                owner="Coiton"
+                shareLink="/"
+                telegramLink="/"
+                xLink="/"
+            />
+            <Banner date="20th May, 5:20pm" />
+            <div>
+                <p className="text-[22px]">
+                    This campaign rewards early adopters who mint and hold a
+                    genesis or limited edition NFT. It will be used to give
+                    early community members special access later.
+                </p>
+                <p className="mt-3 text-[22px]">
+                    <span className="font-bold">Goal: </span> Distribute limited
+                    NFTs and build early collector hype.
+                </p>
+            </div>
+            <TasksSection />
+        </div>
+    );
+};
+
+const tasksObj = [
+    {
+        title: "Mint the Genesis NFT from a drop page.",
+        details: [
+            "Visit the drop page URL",
+            "Connect your crypto wallet (e.g., MetaMask)",
+            'Click the "Mint" button',
+            "Approve the transaction in your wallet",
+        ],
+    },
+    {
+        title: "Hold it in your wallet for at least 7 days (verified via snapshot or chain data)",
+        details: null,
+    },
+    {
+        title: "Share your NFT on Twitter (bonus task)",
+        details: null,
+    },
+];
+
+const TasksSection = () => {
+    const [openIndex, setOpenIndex] = useState(0);
+
+    return (
+        <div className="bg-black p-4 rounded-lg w-full ">
+            <h2 className="text-white text-lg font-medium mb-2">Tasks</h2>
+            <div className="space-y-2">
+                {tasksObj.map((task, idx) => (
+                    <div key={idx}>
+                        <button
+                            className={`w-full flex items-center space-x-5 px-4 py-2 rounded transition-colors focus:outline-none border ${
+                                openIndex === idx
+                                    ? "bg-[#E0FFB0] border-blue-400"
+                                    : "bg-[#E0FFB0] border-transparent"
+                            }`}
+                            onClick={() =>
+                                setOpenIndex(idx === openIndex ? -1 : idx)
+                            }
+                        >
+                            <span className="ml-2 text-2xl text-black">
+                                {openIndex === idx ? "▾" : "▸"}
+                            </span>
+                            <span className="text-black">{task.title}</span>
+                        </button>
+                        {openIndex === idx && task.details && (
+                            <div className="bg-black border border-[#988C8C] rounded px-12 py-4 my-5 mx-8">
+                                <ol className="list-decimal list-inside text-[#EBFFCB] text-[22px] space-y-3">
+                                    {task.details.map((step, i) => (
+                                        <li key={i}>
+                                            {step.includes('"Mint"') ? (
+                                                <span>
+                                                    Click the{" "}
+                                                    <span className="font-semibold">
+                                                        "Mint"
+                                                    </span>{" "}
+                                                    button
+                                                </span>
+                                            ) : (
+                                                step
+                                            )}
+                                        </li>
+                                    ))}
+                                </ol>
+                            </div>
+                        )}
+                    </div>
+                ))}
+            </div>
+        </div>
+    );
+};
+
+export default CampaignDetails;
diff --git a/public/coiton-logo.png b/public/coiton-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..ca7af7b3014cbe88ff7d3abefdde8ce1572ee08c
GIT binary patch
literal 876
zcmV-y1C#uTP)<h;3K|Lk000e1NJLTq000mG000mO1^@s6AM^iV00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0|7}yK~#7FZBtuF
zR6!X2X3p8&b9T$tC{r}k(yR!2h^~ZBJ!V(xAtIuJz^CX6_F!01L{tymjc!mc5d`}X
z#X=NRS}7K!RHiE`nVZ*k-F0^^{j;e=Iq);XIrDup|Mz{v@Mkb8i%R(R>?lES+EG@R
zU#^FK6+ubH9H(7JI$xrr=gjDnC*NqFO(m%`8v}Fm!GFK@u1b#Vl+9m&Sez({lhJQQ
zd#6r?HFG-D$ms1<_37PX2P!tkCj8GH)`=IdSLkS;fa}_rY)B<oR=~EhgY}8S$5$F`
zhQ+ye?S_2cv|bMl3pmc?U^6)5NC~0A3VB&+u4?=cvYcJJidatYo@$H83|Q;`aE#he
zN@dnGbDl~`o-<>))YdJo^MZ#&Yde_VZ!rR=dwXGXJ^}WU4yl1bWZO0fh@j&@YHjI6
z5}vHU5zcaRDs(JH?J0Pr#GB()5G0@;1IIhNuwnU9M9*Ks@Wpdzt~v@ugjxu&yqOhT
z55)?YQJV<zvV&MTuMBA-G~&ej`cbugD;`(whj-g%tiO64v$6}YbkRbHWD;7+0uD_`
zV-@KW9T*~Wd~keTa*lfTdLU?aHf==sM0IAp=1et$0T<e|skGwE@pfpXVR44R=ud>2
z-r{Xd4bq*RnJk>Waua*Dtizg;GQ9lMf>&Q#5pMYm$M2eav@=iT?#pb-luA81nz?qe
zrx&kIR%3N>37)rn#FD}y1e`3)IdTxukp%33pNt|ST^I6o{bh!V@?xiaZJUgANapca
z#>Q074=gAvMfv;^MEVC1e%A=N4t#+Cgt60OOKRFmg~D@965%^_tX9Y3dv!cP(!w^r
zi*y=_Ze;|v9UsZWGbe*{!TheR>l<#Q!!PztMA<!GQzr+8S5O*NX7^;nwj^EMQeEHc
z#GMDL#-nU3x5U%uwR~Y|E-%Pm2Fio66-H@O6e30~5HHsaO;^RE(B|<M$^L!L?&8I>
zMREQCmY=&$r)3e*YbHfRMY=+s*7ggD?(VL?pYv~QT3OmH)c5}Y0000<MNUMnLSTZ0
Cl9LMn

literal 0
HcmV?d00001

diff --git a/public/share-icon.svg b/public/share-icon.svg
new file mode 100644
index 0000000..8c48909
--- /dev/null
+++ b/public/share-icon.svg
@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="32" height="32" rx="10" fill="#EBFFCB"/>
+<path d="M13.5 18.5L18.5 13.5" stroke="#70750B" stroke-width="1.5" stroke-linecap="round"/>
+<path d="M20.8463 18.6095L23.4558 16C25.5147 13.9411 25.5147 10.603 23.4558 8.54416C21.397 6.48528 18.0589 6.48528 16 8.54416L13.3904 11.1537M18.6095 20.8463L16 23.4558C13.9411 25.5147 10.603 25.5147 8.54416 23.4558C6.48528 21.397 6.48528 18.0589 8.54416 16L11.1537 13.3904" stroke="#70750B" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
diff --git a/public/telegram.svg b/public/telegram.svg
new file mode 100644
index 0000000..90c9a01
--- /dev/null
+++ b/public/telegram.svg
@@ -0,0 +1,15 @@
+<svg width="41" height="40" viewBox="0 0 41 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_198_127)">
+<path d="M20.5 0C15.1969 0 10.1062 2.10844 6.35938 5.85781C2.60866 9.6087 0.501073 14.6956 0.5 20C0.5 25.3022 2.60938 30.3928 6.35938 34.1422C10.1062 37.8916 15.1969 40 20.5 40C25.8031 40 30.8937 37.8916 34.6406 34.1422C38.3906 30.3928 40.5 25.3022 40.5 20C40.5 14.6978 38.3906 9.60719 34.6406 5.85781C30.8937 2.10844 25.8031 0 20.5 0Z" fill="url(#paint0_linear_198_127)"/>
+<path d="M9.55315 19.7888C15.3844 17.2488 19.2719 15.5742 21.2157 14.765C26.7719 12.4547 27.925 12.0534 28.6782 12.0399C28.8438 12.0372 29.2125 12.0781 29.4532 12.2727C29.6532 12.4367 29.7094 12.6586 29.7375 12.8144C29.7625 12.97 29.7969 13.3247 29.7688 13.6016C29.4688 16.7641 28.1657 24.4384 27.5032 27.9806C27.225 29.4794 26.6719 29.9819 26.1375 30.0309C24.975 30.1378 24.0938 29.2634 22.9688 28.5263C21.2094 27.3722 20.2157 26.6541 18.5063 25.5281C16.5313 24.2269 17.8125 23.5116 18.9375 22.3428C19.2313 22.0369 24.35 17.3822 24.4469 16.96C24.4594 16.9072 24.4719 16.7103 24.3532 16.6066C24.2375 16.5025 24.0657 16.5381 23.9407 16.5663C23.7625 16.6063 20.9532 18.465 15.5032 22.1422C14.7063 22.6903 13.9844 22.9575 13.3344 22.9434C12.6219 22.9281 11.2469 22.5397 10.225 22.2078C8.97503 21.8006 7.97815 21.5853 8.06565 20.8938C8.1094 20.5338 8.60628 20.1653 9.55315 19.7888Z" fill="white"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_198_127" x1="2000.5" y1="0" x2="2000.5" y2="4000" gradientUnits="userSpaceOnUse">
+<stop stop-color="#2AABEE"/>
+<stop offset="1" stop-color="#229ED9"/>
+</linearGradient>
+<clipPath id="clip0_198_127">
+<rect width="40" height="40" fill="white" transform="translate(0.5)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/public/twitter.svg b/public/twitter.svg
new file mode 100644
index 0000000..dc31b50
--- /dev/null
+++ b/public/twitter.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="46" viewBox="0 0 40 46" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.71429 3C2.5625 3 0 5.5625 0 8.71429V37.2857C0 40.4375 2.5625 43 5.71429 43H34.2857C37.4375 43 40 40.4375 40 37.2857V8.71429C40 5.5625 37.4375 3 34.2857 3H5.71429ZM32.2411 10.5L22.9732 21.0893L33.875 35.5H25.3393L18.6607 26.7589L11.0089 35.5H6.76786L16.6786 24.1696L6.22321 10.5H14.9732L21.0179 18.4911L28 10.5H32.2411ZM28.8661 32.9643L13.6964 12.9018H11.1696L26.5089 32.9643H28.8571H28.8661Z" fill="#F5F5F5"/>
+</svg>