From 87d7cfc4b4f8cf556c85215f3d65e2f1bda1d423 Mon Sep 17 00:00:00 2001 From: BeeXD Date: Sun, 28 Jun 2026 20:16:21 +0530 Subject: [PATCH] feat: add GitHub 'presents' badge to hero section and fix sponsor card sizing --- public/logos/github.svg | 16 +++++++ public/logos/github_black.svg | 11 +++++ src/App.tsx | 2 + src/sections/Hero.tsx | 85 ++++++++++++++++++++++------------- src/sections/Sponsors.tsx | 30 +++++++++++-- 5 files changed, 109 insertions(+), 35 deletions(-) create mode 100644 public/logos/github.svg create mode 100644 public/logos/github_black.svg diff --git a/public/logos/github.svg b/public/logos/github.svg new file mode 100644 index 0000000..454fe75 --- /dev/null +++ b/public/logos/github.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/public/logos/github_black.svg b/public/logos/github_black.svg new file mode 100644 index 0000000..5ddc5f8 --- /dev/null +++ b/public/logos/github_black.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/App.tsx b/src/App.tsx index 1164b93..ea2c67d 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -49,8 +49,10 @@ function Navbar({ onNavClick, logoUrl }: { onNavClick: (e: React.MouseEvent(null); @@ -68,7 +69,7 @@ export default function DevHackHeroCompact() { const isNothingPhone = /Nothing/i.test(ua) || /\bA063\b|\bA065\b|\bA142\b|\bA142P\b/i.test(deviceModel); const is20x9 = Math.abs(ratio - 9 / 20) < 0.05; const isZFold = /SM-F|Galaxy Z Fold|GalaxyZFold|Fold/i.test(ua); - const navEl = typeof document !== 'undefined' ? document.querySelector('nav') : null; + const navEl = typeof document !== 'undefined' ? document.querySelector('header') : null; const measuredNavHeight = navEl ? Math.round(navEl.getBoundingClientRect().height) : 0; setIsMobile(width < 768); @@ -77,6 +78,7 @@ export default function DevHackHeroCompact() { setIsTightHeroSpacingDevice(isCompactPortraitPhone || isFoldOrSurfaceLayout || isZFold); setIsZFoldDevice(isZFold); setNavHeight(measuredNavHeight); + setIsXLDesktop(width >= 1280); }; checkMobile(); window.addEventListener('resize', checkMobile); @@ -142,27 +144,46 @@ export default function DevHackHeroCompact() { {/* Scrolling Content */}
{/* Initial Hero Screen Content */} -
+
0 ? `${navHeight + 48}px` : !isXLDesktop ? '130px' : undefined, marginTop: isNothing20x9 ? '-24px' : isTightHeroSpacingDevice - ? (isZFoldDevice && navHeight > 0 + ? (isZFoldDevice && navHeight > 0 ? `-${Math.max(16, navHeight - 6)}px` : (isMobile ? '-48px' : '-24px')) - : undefined + : undefined }} > -

+ {/* GitHub presents banner + title — single translated block */} +
+ {/* GitHub presents — always above title */} +
+ GitHub logo + + presents + +
+ + {/* Main title */} +

DSU
DEVHACK
3.0

+
{/* end single translated block */} + {/* Small Hero Image on Mobile and Tablet - Positioned between Title and Date Bar */}
@@ -173,37 +194,37 @@ export default function DevHackHeroCompact() { className="w-full h-auto object-contain hover:scale-105 transition-transform" />
- {/* Date Badge and Hanging About Section */}
{/* Registration countdown for June 1 (placed above the date badge, no heading) */}
-
- DEVHACK 3.0 Begins In -
+
+ DEVHACK 3.0 Begins In +
{countdown.total > 0 ? (
@@ -236,7 +257,7 @@ export default function DevHackHeroCompact() { {/* Hanging Image (Positioned directly below the badge) */}
{ return () => window.removeEventListener('resize', checkMobile); }, []); + const titlesponsor = [ + { + name: "GitHub", + logo: "/logos/github.svg", + scale: isMobile ? 1.0 : 1.3, + hoverScale: isMobile ? 1.1 : 1.4 + } + ] const goldSponsors = [ { name: "AIC DSU Innovation Foundation", @@ -21,9 +29,9 @@ const Sponsors: React.FC = () => { hoverScale: isMobile ? 2.8 : 2.3 }, { name: "CodeCrafters.io", logo: "/logos/codecraft.svg" }, - { name:".xyz", logo: "/logos/xyz.png", scale: 1.2, hoverScale: 1.3 }, - { name:"n8n", logo: "/logos/n8n.png", scale: 1.2, hoverScale: 1.3 }, - {name:"Render" , logo: "/logos/render.png", scale: 1.8, hoverScale: 1.9 }, + { name: ".xyz", logo: "/logos/xyz.png", scale: 1.2, hoverScale: 1.3 }, + { name: "n8n", logo: "/logos/n8n.png", scale: 1.2, hoverScale: 1.3 }, + { name: "Render", logo: "/logos/render.png", scale: 1.8, hoverScale: 1.9 }, ] const communityPartners = [ @@ -104,6 +112,22 @@ const Sponsors: React.FC = () => {
*/ } + {/* Title sponsor */} +
+ + + {titlesponsor.map((s, i) => ( + + + + ))} + +
{/* Gold */}