From f2ef266d7a1cfe5bbf0eb2645f298d4251fbe742 Mon Sep 17 00:00:00 2001
From: Nikhil Saboo <ns.nikhilsaboo@gmail.com>
Date: Mon, 30 Sep 2024 11:17:50 +0530
Subject: [PATCH 1/3] Rename title and add button for banxa

---
 components/account/OnboardingModal.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/components/account/OnboardingModal.tsx b/components/account/OnboardingModal.tsx
index c49367710..25348a3fe 100644
--- a/components/account/OnboardingModal.tsx
+++ b/components/account/OnboardingModal.tsx
@@ -27,13 +27,21 @@ interface ButtonListProps {
 
 const exchangeList = [
   {
-    title: "Purchase ZTG with Crypto or Fiat (CEX)",
+    title: "Buy ZTG on Gate (CEX)",
     disabled: false,
     onClick: () =>
       window.open("https://blog.zeitgeist.pm/how-to-buy-ztg-on-gateio/"),
   },
   {
-    title: "Trade for ZTG with Crypto (DEX)",
+    title: "Buy ZTG on Banxa (Fiat)",
+    disabled: false,
+    onClick: () =>
+      window.open(
+        "https://checkout.banxa.com/?coinType=ZTG&blockchain=ZTG&orderMode=BUY",
+      ),
+  },
+  {
+    title: "Buy ZTG on HydraDX (DEX)",
     disabled: false,
     onClick: () => {
       window.open(

From 38c1ccb9b0c5ee1988ce73fc741e5240760075d6 Mon Sep 17 00:00:00 2001
From: Nikhil Saboo <ns.nikhilsaboo@gmail.com>
Date: Tue, 8 Oct 2024 19:08:29 +0530
Subject: [PATCH 2/3] Reformat

---
 components/account/OnboardingModal.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/components/account/OnboardingModal.tsx b/components/account/OnboardingModal.tsx
index 25348a3fe..673f60e65 100644
--- a/components/account/OnboardingModal.tsx
+++ b/components/account/OnboardingModal.tsx
@@ -15,6 +15,7 @@ interface StepperProps {
 }
 
 interface ButtonProps {
+  className?: string;
   title: string;
   icon?: React.ReactNode | string;
   disabled: boolean;
@@ -27,13 +28,15 @@ interface ButtonListProps {
 
 const exchangeList = [
   {
-    title: "Buy ZTG on Gate (CEX)",
+    title: "Gate.io (CEX)",
     disabled: false,
     onClick: () =>
       window.open("https://blog.zeitgeist.pm/how-to-buy-ztg-on-gateio/"),
   },
   {
-    title: "Buy ZTG on Banxa (Fiat)",
+    className: "",
+    title: "Banxa (Fiat)",
+    icon: <span className="bg-green-600 px-2 py-1 text-xs rounded text-white">NEW</span>,
     disabled: false,
     onClick: () =>
       window.open(
@@ -41,7 +44,7 @@ const exchangeList = [
       ),
   },
   {
-    title: "Buy ZTG on HydraDX (DEX)",
+    title: "HydraDX (DEX)",
     disabled: false,
     onClick: () => {
       window.open(
@@ -163,7 +166,7 @@ export const ButtonList: React.FC<ButtonListProps> = ({ buttonList }) => {
           key={index}
           disabled={button.disabled}
           onClick={button.onClick}
-          className={`flex min-h-[56px] w-full items-center justify-center rounded-lg bg-mystic p-2 text-center hover:bg-gray-100 ${
+          className={`flex min-h-[56px] w-full items-center justify-center rounded-lg bg-mystic p-2 text-center hover:bg-gray-100 ${button?.className} ${
             button.disabled === true ? "bg-gray-light-2" : "border"
           }`}
         >

From 33de8cd64614857f65390c8003254d4c478fc51d Mon Sep 17 00:00:00 2001
From: Nikhil Saboo <ns.nikhilsaboo@gmail.com>
Date: Tue, 8 Oct 2024 19:09:25 +0530
Subject: [PATCH 3/3] Fix prettier issues

---
 components/account/OnboardingModal.tsx |  6 +++++-
 components/ui/ReferendumSummary.tsx    | 12 ++++++------
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/components/account/OnboardingModal.tsx b/components/account/OnboardingModal.tsx
index 673f60e65..265cf9ed6 100644
--- a/components/account/OnboardingModal.tsx
+++ b/components/account/OnboardingModal.tsx
@@ -36,7 +36,11 @@ const exchangeList = [
   {
     className: "",
     title: "Banxa (Fiat)",
-    icon: <span className="bg-green-600 px-2 py-1 text-xs rounded text-white">NEW</span>,
+    icon: (
+      <span className="rounded bg-green-600 px-2 py-1 text-xs text-white">
+        NEW
+      </span>
+    ),
     disabled: false,
     onClick: () =>
       window.open(
diff --git a/components/ui/ReferendumSummary.tsx b/components/ui/ReferendumSummary.tsx
index 69f9756bf..210ea73aa 100644
--- a/components/ui/ReferendumSummary.tsx
+++ b/components/ui/ReferendumSummary.tsx
@@ -12,12 +12,12 @@ const ReferendumSummary = ({
   return (
     <>
       {referendum && (
-        <div className="w-full flex flex-col shadow-lg rounded-lg px-10 py-6 gap-4 font-medium">
+        <div className="flex w-full flex-col gap-4 rounded-lg px-10 py-6 font-medium shadow-lg">
           <div className="flex items-center">
             <div className="text-lg">Referendum</div>
             <a
               href={`https://polkadot.polkassembly.io/referenda/${referendumIndex}`}
-              className="ml-auto text-sm flex gap-2 items-center justify-center text-black rounded-md px-2 py-2 "
+              className="ml-auto flex items-center justify-center gap-2 rounded-md px-2 py-2 text-sm text-black "
               target="_blank"
               rel="noreferrer"
             >
@@ -30,7 +30,7 @@ const ReferendumSummary = ({
             </a>
           </div>
           <div className="flex items-center justify-center">
-            <div className="h-[150px] w-[300px] mt-3 ">
+            <div className="mt-3 h-[150px] w-[300px] ">
               <CircularProgressbar
                 value={barValue}
                 circleRatio={0.5}
@@ -49,13 +49,13 @@ const ReferendumSummary = ({
 
           <div className="flex">
             <div className="flex flex-col">
-              <div className="text-[#0070EB] font-mono text-xl">
+              <div className="font-mono text-xl text-[#0070EB]">
                 {referendum.ayePercentage.mul(100).toFixed(1)}%
               </div>
               <div className="text-lg">Aye</div>
             </div>
-            <div className="flex flex-col ml-auto">
-              <div className="text-[#FC9965] font-mono text-xl">
+            <div className="ml-auto flex flex-col">
+              <div className="font-mono text-xl text-[#FC9965]">
                 {referendum.nayPercentage.mul(100).toFixed(1)}%
               </div>
               <div className="text-lg">Nay</div>