From 94f9bd76ced33b6cd120be5f8f4070221c104588 Mon Sep 17 00:00:00 2001
From: Marco Souza <marco.souza@mongodb.com>
Date: Sun, 26 Apr 2026 16:06:50 -0300
Subject: [PATCH 1/2] fix: add p-4 padding to all w-12 h-12 icon containers

Updated 9 files to include consistent padding on icon containers:
- CallToAction, SectionHeader, ChannelCard
- about.astro (values section)
- join-us.astro (contact section)
- contact.astro (contact methods section)
---
 src/components/ui/CallToAction.astro  | 2 +-
 src/components/ui/ChannelCard.astro   | 2 +-
 src/components/ui/IconCard.astro      | 2 +-
 src/components/ui/SectionHeader.astro | 2 +-
 src/pages/about.astro                 | 2 +-
 src/pages/contact.astro               | 6 +++---
 src/pages/join-us.astro               | 4 ++--
 7 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/components/ui/CallToAction.astro b/src/components/ui/CallToAction.astro
index f781b53..3884509 100644
--- a/src/components/ui/CallToAction.astro
+++ b/src/components/ui/CallToAction.astro
@@ -15,7 +15,7 @@ const { icon, title, description, class: className = '' } = Astro.props;
   <div class="absolute inset-0 bg-[radial-gradient(ellipse_at_center,_var(--tw-gradient-stops))] from-primary/10 via-transparent to-transparent"></div>
 
   <div class="relative mx-auto max-w-4xl px-4 text-center">
-    <div class="w-12 h-12 md:w-16 md:h-16 rounded-2xl bg-gradient-to-br from-primary to-primary/70 flex items-center justify-center shadow-lg shadow-primary/20 mx-auto mb-4 md:mb-6">
+    <div class="w-12 h-12 p-4 md:w-16 md:h-16 md:p-4 rounded-2xl bg-gradient-to-br from-primary to-primary/70 flex items-center justify-center shadow-lg shadow-primary/20 mx-auto mb-4 md:mb-6">
       <Icon name={icon} class="w-6 h-6 md:w-8 md:h-8 text-primary-content" />
     </div>
     <h2 class="text-xl md:text-2xl lg:text-3xl font-bold mb-3 md:mb-4">{title}</h2>
diff --git a/src/components/ui/ChannelCard.astro b/src/components/ui/ChannelCard.astro
index 92261fa..bfe7edf 100644
--- a/src/components/ui/ChannelCard.astro
+++ b/src/components/ui/ChannelCard.astro
@@ -39,7 +39,7 @@ const c = COLORS[color];
 <li class="group relative grid">
   <div class={`absolute inset-0 bg-gradient-to-br ${c.from} ${c.to} rounded-2xl transform rotate-1 group-hover:rotate-2 transition-transform duration-300`}></div>
   <div class={`relative bg-base-100 rounded-2xl border border-base-300 p-6 ${c.border} hover:shadow-lg transition-all duration-300 grid grid-rows-[auto_auto_1fr]`}>
-    <div class={`w-12 h-12 rounded-xl bg-gradient-to-br ${c.from} ${c.text} flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300`}>
+    <div class={`w-12 h-12 p-4 rounded-xl bg-gradient-to-br ${c.from} ${c.text} flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300`}>
       <Icon name={icon} class="w-6 h-6" />
     </div>
     <h3 class="text-xl font-semibold mb-2 group-hover:text-primary transition-colors">{title}</h3>
diff --git a/src/components/ui/IconCard.astro b/src/components/ui/IconCard.astro
index 4a2556b..cee12c9 100644
--- a/src/components/ui/IconCard.astro
+++ b/src/components/ui/IconCard.astro
@@ -53,7 +53,7 @@ const colors = colorPairs[color];
 <li class={`relative group grid ${className}`}>
   <div class={`absolute inset-0 bg-gradient-to-br ${colors.from} ${colors.to} rounded-2xl transform rotate-1 group-hover:rotate-2 transition-transform duration-300`}></div>
   <div class={`relative bg-base-100 rounded-2xl border border-base-300 p-6 text-center hover:shadow-lg ${colors.hoverBorder} ${colors.hoverShadow} transition-all duration-300 grid grid-rows-[1fr_auto]`}>
-    <div class={`text-4xl font-bold bg-gradient-to-br ${colors.gradientFrom} ${colors.gradientTo} bg-clip-text text-transparent mb-2 self-center`}>
+    <div class={`text-4xl p-4 font-bold bg-gradient-to-br ${colors.gradientFrom} ${colors.gradientTo} bg-clip-text text-transparent mb-2 self-center`}>
       {value}
     </div>
     <div class="text-sm text-base-content/70">{label}</div>
diff --git a/src/components/ui/SectionHeader.astro b/src/components/ui/SectionHeader.astro
index 62b6fab..21e5841 100644
--- a/src/components/ui/SectionHeader.astro
+++ b/src/components/ui/SectionHeader.astro
@@ -20,7 +20,7 @@ const colorGradients = {
 ---
 
 <div class={`flex items-center gap-3 md:gap-4 ${className}`}>
-  <div class={`w-12 h-12 md:w-14 md:h-14 rounded-2xl bg-gradient-to-br ${colorGradients[color]} flex items-center justify-center shadow-lg`}>
+  <div class={`w-12 h-12 p-4 md:w-14 md:h-14 md:p-4 rounded-2xl bg-gradient-to-br ${colorGradients[color]} flex items-center justify-center shadow-lg`}>
     <Icon name={icon} class="w-6 h-6 md:w-7 md:h-7 text-primary-content" />
   </div>
   <div>
diff --git a/src/pages/about.astro b/src/pages/about.astro
index e54c0ce..4d9b0f8 100644
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@@ -73,7 +73,7 @@ const description = t('about.hero.subtitle');
             <li class="relative group grid">
               <div class={`absolute inset-0 bg-gradient-to-br ${c.from} ${c.to} rounded-2xl transform rotate-1 group-hover:rotate-2 transition-transform duration-300`}></div>
               <div class={`relative bg-base-100 rounded-2xl border border-base-300 p-6 ${c.border} hover:shadow-lg transition-all duration-300 grid grid-rows-[auto_auto_1fr]`}>
-                <div class={`w-12 h-12 rounded-xl bg-gradient-to-br ${c.gradient} flex items-center justify-center mb-4`}>
+                <div class={`w-12 h-12 p-4 rounded-xl bg-gradient-to-br ${c.gradient} flex items-center justify-center mb-4`}>
                   <Icon name={c.icon} class="w-6 h-6 text-white" />
                 </div>
                 <h3 class="text-xl font-bold mb-2">{t(value.titleKey)}</h3>
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
index e8defdd..c2e11ce 100644
--- a/src/pages/contact.astro
+++ b/src/pages/contact.astro
@@ -87,7 +87,7 @@ const inquiries = [
       <ul class="grid gap-6 md:grid-cols-3">
         <li>
           <a href={`mailto:${CONTACT_EMAIL}`} class="group block p-6 rounded-2xl border border-primary/20 bg-base-100 transition-all duration-300 hover:shadow-lg hover:border-primary/40 grid grid-rows-[auto_auto_1fr]">
-            <div class="w-12 h-12 rounded-xl bg-primary/10 flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300">
+            <div class="w-12 h-12 p-4 rounded-xl bg-primary/10 flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300">
               <Icon name="lucide:mail" class="w-6 h-6 text-primary" />
             </div>
             <span class="block text-sm text-base-content/60 mb-1">{t('contact.email.label')}</span>
@@ -96,7 +96,7 @@ const inquiries = [
         </li>
         <li>
           <a href="#" class="group block p-6 rounded-2xl border border-violet-500/20 bg-base-100 transition-all duration-300 hover:shadow-lg hover:border-violet-500/40 grid grid-rows-[auto_auto_1fr]">
-            <div class="w-12 h-12 rounded-xl bg-violet-500/10 flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300">
+            <div class="w-12 h-12 p-4 rounded-xl bg-violet-500/10 flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300">
               <Icon name="lucide:message-circle" class="w-6 h-6 text-violet-500" />
             </div>
             <span class="block text-sm text-base-content/60 mb-1">{t('contact.discord.label')}</span>
@@ -105,7 +105,7 @@ const inquiries = [
         </li>
         <li>
           <a href="#" class="group block p-6 rounded-2xl border border-emerald-500/20 bg-base-100 transition-all duration-300 hover:shadow-lg hover:border-emerald-500/40 grid grid-rows-[auto_auto_1fr]">
-            <div class="w-12 h-12 rounded-xl bg-emerald-500/10 flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300">
+            <div class="w-12 h-12 p-4 rounded-xl bg-emerald-500/10 flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300">
               <Icon name="lucide:calendar" class="w-6 h-6 text-emerald-500" />
             </div>
             <span class="block text-sm text-base-content/60 mb-1">{t('contact.events.label')}</span>
diff --git a/src/pages/join-us.astro b/src/pages/join-us.astro
index e339629..48f4771 100644
--- a/src/pages/join-us.astro
+++ b/src/pages/join-us.astro
@@ -131,7 +131,7 @@ const channelStats = communicationChannels.length;
             href="/contact"
             class="group relative p-6 bg-base-100 rounded-2xl border border-base-300 hover:border-primary/30 hover:shadow-lg hover:shadow-primary/5 transition-all duration-300 text-center"
           >
-            <div class="w-12 h-12 rounded-xl bg-primary/10 flex items-center justify-center mx-auto mb-4 group-hover:scale-110 transition-transform duration-300">
+            <div class="w-12 h-12 p-4 rounded-xl bg-primary/10 flex items-center justify-center mx-auto mb-4 group-hover:scale-110 transition-transform duration-300">
               <Icon name="lucide:send" class="w-6 h-6 text-primary" />
             </div>
             <h3 class="font-semibold mb-2">{t('joinUs.contact.sendTitle')}</h3>
@@ -144,7 +144,7 @@ const channelStats = communicationChannels.length;
             rel="noopener noreferrer"
             class="group relative p-6 bg-base-100 rounded-2xl border border-base-300 hover:border-violet-500/30 hover:shadow-lg hover:shadow-violet-500/5 transition-all duration-300 text-center"
           >
-            <div class="w-12 h-12 rounded-xl bg-violet-500/10 flex items-center justify-center mx-auto mb-4 group-hover:scale-110 transition-transform duration-300">
+            <div class="w-12 h-12 p-4 rounded-xl bg-violet-500/10 flex items-center justify-center mx-auto mb-4 group-hover:scale-110 transition-transform duration-300">
               <Icon name="lucide:message-square" class="w-6 h-6 text-violet-500" />
             </div>
             <h3 class="font-semibold mb-2">{t('joinUs.contact.discordTitle')}</h3>

From 2178bdbc4e00e558b36d6f3bc25dfd2000493f52 Mon Sep 17 00:00:00 2001
From: Marco Souza <marco.souza@mongodb.com>
Date: Sun, 26 Apr 2026 16:23:30 -0300
Subject: [PATCH 2/2] fix: add py

---
 src/components/ui/HeroSection.astro | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ui/HeroSection.astro b/src/components/ui/HeroSection.astro
index 44df441..0f3b68c 100644
--- a/src/components/ui/HeroSection.astro
+++ b/src/components/ui/HeroSection.astro
@@ -19,7 +19,7 @@ interface Props {
 const { eyebrow, title, subtitle, stats, class: className = '' } = Astro.props;
 ---
 
-<section class={`relative overflow-hidden bg-gradient-to-br from-primary/5 via-base-100 to-base-100 border-b border-base-300/50 ${className}`}>
+<section class={`relative overflow-hidden bg-gradient-to-br from-primary/5 via-base-100 to-base-100 border-b border-base-300/50 py-12 ${className}`}>
   <!-- Background decoration -->
   <div class="absolute inset-0 overflow-hidden pointer-events-none">
     <div class="absolute -top-40 -right-40 w-96 h-96 bg-primary/5 rounded-full blur-3xl"></div>