From 6c8cf348fdb36cfa60d1ac6993722dd98d625e89 Mon Sep 17 00:00:00 2001
From: "Sahil.Sharma3184@gmail.com" <sahil.sharma3184@gmail.com>
Date: Fri, 24 Apr 2026 06:02:03 +0530
Subject: [PATCH 1/2] fix: improve sponsor button hover state

---
 src/components/Support/Support.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Support/Support.jsx b/src/components/Support/Support.jsx
index 41a9d168a0c2..98e8f2ff56fa 100644
--- a/src/components/Support/Support.jsx
+++ b/src/components/Support/Support.jsx
@@ -285,7 +285,7 @@ export default class Support extends Component {
 
           <div className="w-full mt-4">
             <a
-              className="inline-block py-[0.4em] px-[1em] uppercase text-[#175d96] border border-[#175d96] rounded-4xl transition-all duration-[250ms] hover:bg-[#175d96] hover:text-white dark:text-[#4fa8ff] dark:border-[#4fa8ff] dark:hover:bg-[#4fa8ff] dark:hover:text-[#04131f]"
+              className="inline-block py-[0.4em] px-[1em] uppercase text-[#175d96] border border-[#175d96] rounded-4xl transition-all duration-[250ms] hover:border-[#2f78c4] hover:bg-[#2f78c4] hover:text-white hover:shadow-[0_8px_18px_rgba(47,120,196,0.28)] dark:text-[#4fa8ff] dark:border-[#4fa8ff] dark:hover:border-[#4fa8ff] dark:hover:bg-[#2f78c4] dark:hover:text-white"
               href="https://opencollective.com/webpack#support"
             >
               Become a {rank === "backer" ? "backer" : "sponsor"}

From 292473c304a2bc0140fa4a202df2bc7c34e9a54c Mon Sep 17 00:00:00 2001
From: "Sahil.Sharma3184@gmail.com" <sahil.sharma3184@gmail.com>
Date: Fri, 24 Apr 2026 18:54:31 +0530
Subject: [PATCH 2/2] style(support): redesign sponsor button

---
 src/components/Support/Support.jsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/Support/Support.jsx b/src/components/Support/Support.jsx
index 98e8f2ff56fa..2523fad2d4b8 100644
--- a/src/components/Support/Support.jsx
+++ b/src/components/Support/Support.jsx
@@ -285,10 +285,12 @@ export default class Support extends Component {
 
           <div className="w-full mt-4">
             <a
-              className="inline-block py-[0.4em] px-[1em] uppercase text-[#175d96] border border-[#175d96] rounded-4xl transition-all duration-[250ms] hover:border-[#2f78c4] hover:bg-[#2f78c4] hover:text-white hover:shadow-[0_8px_18px_rgba(47,120,196,0.28)] dark:text-[#4fa8ff] dark:border-[#4fa8ff] dark:hover:border-[#4fa8ff] dark:hover:bg-[#2f78c4] dark:hover:text-white"
+              className="inline-flex items-center rounded-2xl bg-[#68c8fb] p-[5px] transition-all duration-200 hover:bg-[#7bd0ff]"
               href="https://opencollective.com/webpack#support"
             >
-              Become a {rank === "backer" ? "backer" : "sponsor"}
+              <span className="inline-flex items-center rounded-[1.05rem] bg-gradient-to-b from-[#1f4f82] to-[#173b66] px-6 py-2.5 text-xs font-black tracking-[0.08em] text-slate-50 uppercase shadow-[inset_0_2px_0_rgba(255,255,255,0.08),inset_0_0_0_3px_rgba(10,31,56,0.85),0_1px_0_rgba(255,255,255,0.06)]">
+                Become a {rank === "backer" ? "backer" : "sponsor"}
+              </span>
             </a>
           </div>
         </div>