From df7fb757a9978bed161119a65480db96334647be Mon Sep 17 00:00:00 2001
From: Pablo Pettinari <pettinarip@gmail.com>
Date: Wed, 24 Sep 2025 13:12:29 +0200
Subject: [PATCH 1/4] fix styles and spacing in devconnect banner

---
 .../DevconnectBanner/Variation1/index.tsx     | 35 ++++++++++---------
 1 file changed, 18 insertions(+), 17 deletions(-)

diff --git a/src/components/DevconnectBanner/Variation1/index.tsx b/src/components/DevconnectBanner/Variation1/index.tsx
index 2624055d62b..fe04d140637 100644
--- a/src/components/DevconnectBanner/Variation1/index.tsx
+++ b/src/components/DevconnectBanner/Variation1/index.tsx
@@ -11,25 +11,25 @@ const DevconnectBannerVariation1 = () => {
   return (
     <div className="relative w-full">
       <Banner className="h-[66px] w-full" />
-      <div className="absolute inset-0 flex h-[66px] w-full items-center justify-between px-3 md:px-6">
-        <div className="flex flex-col gap-0 md:flex-row md:items-center md:gap-4">
-          <Image
-            src={DevconnectLogo}
-            alt="Devconnect"
-            className="h-[27px] w-auto md:h-[50px]"
-            sizes="(max-width: 768px) 77px, 142px"
-          />
-          <div className="hidden sm:block">
-            <p className="text-xs/6xs text-black">
-              <strong>17 - 22 Nov</strong> 2025
-            </p>
-            <p className="text-xs/6xs font-bold text-black">
-              Buenos Aires, Argentina
+      <div className="absolute inset-0 flex h-[66px] w-full items-center justify-between gap-4 px-3 md:px-6">
+        <div className="flex flex-col gap-1 md:flex-row md:items-center md:gap-4">
+          <div className="min-w-[80px]">
+            <Image
+              src={DevconnectLogo}
+              alt="Devconnect"
+              className="h-[27px] w-auto object-contain md:h-[50px]"
+              sizes="(max-width: 768px) 77px, 142px"
+            />
+          </div>
+          <div className="hidden text-2xs/6xs font-bold text-black sm:block md:text-xs/6xs">
+            <p className="whitespace-nowrap">
+              17 - 22 Nov <span className="font-normal">2025</span>
             </p>
+            <p className="whitespace-nowrap">Buenos Aires, Argentina</p>
           </div>
         </div>
-        <div className="max-w-[200px] text-wrap text-center md:max-w-[287px] lg:max-w-[474px]">
-          <p className="text-xs font-bold text-black md:text-sm lg:text-xl">
+        <div className="text-wrap text-center">
+          <p className="text-xs font-extrabold text-black sm:text-sm md:text-xl">
             {t(
               "page-index-devconnect-banner-join-the-biggest-ethereum-event-of-the-year"
             )}
@@ -38,8 +38,9 @@ const DevconnectBannerVariation1 = () => {
         <ButtonLink
           href="https://devconnect.org/"
           size="sm"
+          variant="ghost"
           hideArrow
-          className="rounded-none border-b-2 border-b-[#215D93] bg-[#74ACDF] uppercase text-2xs text-white hover:bg-[#215D93] md:text-md"
+          className="min-h-0 whitespace-nowrap rounded-none border-b-2 border-b-[#215D93] bg-[#74ACDF] text-xs/none font-bold uppercase text-white hover:bg-[#215D93] hover:!text-white active:bg-[#215D93] active:!text-white md:text-md/none"
         >
           {t("page-index-devconnect-banner-get-tickets")}
         </ButtonLink>

From 6fd56cab175ba75f6e1776b8a952ac8aea5ef2d7 Mon Sep 17 00:00:00 2001
From: Pablo Pettinari <pettinarip@gmail.com>
Date: Wed, 24 Sep 2025 13:33:01 +0200
Subject: [PATCH 2/4] fix banner layout to fit main text better

---
 .../DevconnectBanner/Variation1/index.tsx     | 26 ++++++++++---------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/src/components/DevconnectBanner/Variation1/index.tsx b/src/components/DevconnectBanner/Variation1/index.tsx
index fe04d140637..963b7073cab 100644
--- a/src/components/DevconnectBanner/Variation1/index.tsx
+++ b/src/components/DevconnectBanner/Variation1/index.tsx
@@ -12,7 +12,7 @@ const DevconnectBannerVariation1 = () => {
     <div className="relative w-full">
       <Banner className="h-[66px] w-full" />
       <div className="absolute inset-0 flex h-[66px] w-full items-center justify-between gap-4 px-3 md:px-6">
-        <div className="flex flex-col gap-1 md:flex-row md:items-center md:gap-4">
+        <div className="flex flex-1 flex-col gap-1 md:flex-row md:items-center md:gap-4">
           <div className="min-w-[80px]">
             <Image
               src={DevconnectLogo}
@@ -28,22 +28,24 @@ const DevconnectBannerVariation1 = () => {
             <p className="whitespace-nowrap">Buenos Aires, Argentina</p>
           </div>
         </div>
-        <div className="text-wrap text-center">
-          <p className="text-xs font-extrabold text-black sm:text-sm md:text-xl">
+        <div className="flex-1 text-wrap text-center lg:whitespace-nowrap">
+          <p className="line-clamp-3 text-xs font-extrabold text-black sm:text-sm md:min-w-[300px] md:text-xl">
             {t(
               "page-index-devconnect-banner-join-the-biggest-ethereum-event-of-the-year"
             )}
           </p>
         </div>
-        <ButtonLink
-          href="https://devconnect.org/"
-          size="sm"
-          variant="ghost"
-          hideArrow
-          className="min-h-0 whitespace-nowrap rounded-none border-b-2 border-b-[#215D93] bg-[#74ACDF] text-xs/none font-bold uppercase text-white hover:bg-[#215D93] hover:!text-white active:bg-[#215D93] active:!text-white md:text-md/none"
-        >
-          {t("page-index-devconnect-banner-get-tickets")}
-        </ButtonLink>
+        <div className="flex flex-1 justify-end">
+          <ButtonLink
+            href="https://devconnect.org/"
+            size="sm"
+            variant="ghost"
+            hideArrow
+            className="min-h-0 whitespace-nowrap rounded-none border-b-2 border-b-[#215D93] bg-[#74ACDF] text-xs/none font-bold uppercase text-white hover:bg-[#215D93] hover:!text-white active:bg-[#215D93] active:!text-white md:text-md/none"
+          >
+            {t("page-index-devconnect-banner-get-tickets")}
+          </ButtonLink>
+        </div>
       </div>
     </div>
   )

From 252d572682872e6851bf9f3c2b79e35184f81ae2 Mon Sep 17 00:00:00 2001
From: Pablo Pettinari <pettinarip@gmail.com>
Date: Wed, 24 Sep 2025 13:51:37 +0200
Subject: [PATCH 3/4] adjust styles for devconnect banner variation 2

---
 .../DevconnectBanner/Variation2/index.tsx         | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/components/DevconnectBanner/Variation2/index.tsx b/src/components/DevconnectBanner/Variation2/index.tsx
index ecb31f551e9..10f6cc93dd7 100644
--- a/src/components/DevconnectBanner/Variation2/index.tsx
+++ b/src/components/DevconnectBanner/Variation2/index.tsx
@@ -23,13 +23,15 @@ const DevconnectBannerVariation2 = () => {
           className="h-[65px] w-auto object-contain"
           sizes="202px"
         />
-        <div className="text-center font-bold text-white">
-          <p>17 - 22 Nov 2025</p>
-          <p>Buenos Aires, Argentina</p>
+        <div className="text-center text-white md:text-end">
+          <p>
+            <span className="font-bold">17 - 22 Nov</span> 2025
+          </p>
+          <p className="whitespace-nowrap font-bold">Buenos Aires, Argentina</p>
         </div>
       </div>
-      <div className="mb-8 max-w-[640px] text-center">
-        <p className="text-3xl font-bold text-white [text-shadow:0_4px_8px_rgba(0,0,0,0.65)] md:text-5xl">
+      <div className="mb-8 max-w-[400px] text-center md:max-w-[640px]">
+        <p className="text-3xl font-extrabold text-white [text-shadow:0_4px_8px_rgba(0,0,0,0.65)] md:text-5xl">
           {t(
             "page-index-devconnect-banner-join-the-biggest-ethereum-event-of-the-year"
           )}
@@ -38,8 +40,9 @@ const DevconnectBannerVariation2 = () => {
       <ButtonLink
         href="https://devconnect.org/"
         size="sm"
+        variant="ghost"
         hideArrow
-        className="rounded-none border-b-2 border-b-[#B2820A] bg-[#F6B40E] font-bold uppercase text-[2xs] text-black hover:bg-[#B2820A] hover:!text-black md:text-md"
+        className="min-h-0 whitespace-nowrap rounded-none border-b-2 border-b-[#B2820A] bg-[#F6B40E] px-4 text-md/none font-bold uppercase text-black hover:bg-[#B2820A] hover:!text-black active:text-black"
       >
         {t("page-index-devconnect-banner-get-tickets")}
       </ButtonLink>

From c8519ce283890d5694e27da7699a4e120a2c35e5 Mon Sep 17 00:00:00 2001
From: Pablo Pettinari <pettinarip@gmail.com>
Date: Wed, 24 Sep 2025 14:41:36 +0200
Subject: [PATCH 4/4] adjust line-height

---
 src/components/DevconnectBanner/Variation1/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/DevconnectBanner/Variation1/index.tsx b/src/components/DevconnectBanner/Variation1/index.tsx
index 963b7073cab..220cdf591bc 100644
--- a/src/components/DevconnectBanner/Variation1/index.tsx
+++ b/src/components/DevconnectBanner/Variation1/index.tsx
@@ -29,7 +29,7 @@ const DevconnectBannerVariation1 = () => {
           </div>
         </div>
         <div className="flex-1 text-wrap text-center lg:whitespace-nowrap">
-          <p className="line-clamp-3 text-xs font-extrabold text-black sm:text-sm md:min-w-[300px] md:text-xl">
+          <p className="line-clamp-3 text-xs font-extrabold !leading-4xs text-black sm:text-sm md:min-w-[300px] md:text-xl">
             {t(
               "page-index-devconnect-banner-join-the-biggest-ethereum-event-of-the-year"
             )}