From da5810b1c43b680ce2f3e435e896a291e8774b3e Mon Sep 17 00:00:00 2001
From: Alexandra Hu <108170281+allexandrahu@users.noreply.github.com>
Date: Thu, 1 Jan 2026 18:43:36 -0800
Subject: [PATCH 1/3] fixed sizing for desktop

---
 .../Components/SponsorComponents/SponsorTicketComp.tsx    | 2 +-
 apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx    | 8 +++++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx b/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
index 15297d55..36eefb2d 100644
--- a/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
+++ b/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
@@ -9,6 +9,7 @@ export type SponsorTicketProps = {
   isSponsorUs?: boolean;
   logoPath?: string;
   ticketWidthVw?: number;
+  logoScale?: number;
 };
 
 /**
@@ -22,7 +23,6 @@ export default function SponsorTicketComp({
   logoPath,
   ticketWidthVW = 20,
 }: SponsorTicketProps & { ticketWidthVW?: number }): JSX.Element {
-  
   return (
     <div
       className="flex items-center justify-center relative"
diff --git a/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx b/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
index 9e52bd5f..c105abcc 100644
--- a/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
+++ b/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
@@ -18,6 +18,11 @@ import YelpLogo from "../../lib/Assets/SVG/SponsorUsAssets/Logos/yelp.svg";
 import VMwareLogo from "../../lib/Assets/SVG/SponsorUsAssets/Logos/vmware.svg";
 import ToastLogo from "../../lib/Assets/SVG/SponsorUsAssets/Logos/toast.svg";
 
+const logoScaleMap: Record<string, number> = {
+  [DatadogLogo]: 0.6,
+  [ToastLogo]: 0.6,
+};
+
 const desktopRows: string[][] = [
   [GoogleLogo, CarGurusLogo, MetaLogo, DatadogLogo],
   [SimplisafeLogo, WoodMacLogo, YelpLogo],
@@ -57,6 +62,7 @@ function makeSponsorRow(ticketWidthVW: number, logos: string[]) {
           logoPath={logo}
           isSponsorUs={false}
           ticketWidthVW={ticketWidthVW}
+          logoScale={logoScaleMap[logo] ?? 1}
         />
       ))}
     </div>
@@ -74,7 +80,7 @@ export default function PastSponsors(): JSX.Element {
     "w-1/2 flex justify-center",
     isMobile && "mt-12 mb-6",
     isTablet && "mt-16 mb-6",
-    isDesktop && "mt-20 mb-6"
+    isDesktop && "mt-20 mb-6",
   );
 
   return (

From 45d73a8523bd92e6911e88b652d34e7dba36c41a Mon Sep 17 00:00:00 2001
From: Alexandra Hu <108170281+allexandrahu@users.noreply.github.com>
Date: Thu, 1 Jan 2026 19:09:38 -0800
Subject: [PATCH 2/3] fix spacing

---
 .../SponsorComponents/SponsorTicketComp.tsx   | 34 +++++++--
 .../app/sponsor-us/Sections/PastSponsors.tsx  | 76 ++++++++++---------
 2 files changed, 69 insertions(+), 41 deletions(-)

diff --git a/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx b/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
index 36eefb2d..a93ffa71 100644
--- a/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
+++ b/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
@@ -22,20 +22,40 @@ export default function SponsorTicketComp({
   isSponsorUs = false,
   logoPath,
   ticketWidthVW = 20,
+  logoScale = 1,
 }: SponsorTicketProps & { ticketWidthVW?: number }): JSX.Element {
   return (
     <div
       className="flex items-center justify-center relative"
       style={{ width: `${ticketWidthVW}vw`, height: "auto" }}
     >
+
       {logoPath && (
-        <Image
-          width={100}
-          height={100}
-          alt="image of ticket sponsor"
-          src={logoPath}
-          className="absolute z-10"
-        />
+        <div
+          className="absolute z-10 flex items-center justify-center overflow-hidden"
+          style={{
+            inset: 0,
+          }}
+        >
+          <div
+            className="flex items-center justify-center"
+            style={{
+              width: "60%",
+              height: "45%",
+              transform: `scale(${logoScale})`,
+              transformOrigin: "center",
+            }}
+          >
+            <Image
+              fill
+              alt="image of ticket sponsor"
+              src={logoPath}
+              style={{ objectFit: "contain" }}
+              sizes="(max-width: 768px) 60vw, 20vw"
+              priority={false}
+            />
+          </div>
+        </div>
       )}
 
       {isSponsorUs ? (
diff --git a/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx b/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
index c105abcc..d3ebc0ec 100644
--- a/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
+++ b/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
@@ -18,39 +18,45 @@ import YelpLogo from "../../lib/Assets/SVG/SponsorUsAssets/Logos/yelp.svg";
 import VMwareLogo from "../../lib/Assets/SVG/SponsorUsAssets/Logos/vmware.svg";
 import ToastLogo from "../../lib/Assets/SVG/SponsorUsAssets/Logos/toast.svg";
 
-const logoScaleMap: Record<string, number> = {
-  [DatadogLogo]: 0.6,
-  [ToastLogo]: 0.6,
-};
-
-const desktopRows: string[][] = [
-  [GoogleLogo, CarGurusLogo, MetaLogo, DatadogLogo],
-  [SimplisafeLogo, WoodMacLogo, YelpLogo],
-  [VMwareLogo, ToastLogo],
+type LogoItem = { logoPath: string; logoScale?: number };
+
+const desktopRows: LogoItem[][] = [
+  [
+    { logoPath: GoogleLogo },
+    { logoPath: CarGurusLogo },
+    { logoPath: MetaLogo },
+    { logoPath: DatadogLogo, logoScale: 1.2 },
+  ],
+  [
+    { logoPath: SimplisafeLogo },
+    { logoPath: WoodMacLogo },
+    { logoPath: YelpLogo },
+  ],
+  [{ logoPath: VMwareLogo }, { logoPath: ToastLogo, logoScale: 1.2 }],
 ];
 
-const tabletRows: string[][] = [
-  [GoogleLogo, CarGurusLogo],
-  [MetaLogo, DatadogLogo],
-  [SimplisafeLogo, WoodMacLogo],
-  [YelpLogo, VMwareLogo],
-  [ToastLogo],
+const tabletRows: LogoItem[][] = [
+  [{ logoPath: GoogleLogo }, { logoPath: CarGurusLogo }],
+  [{ logoPath: MetaLogo }, { logoPath: DatadogLogo, logoScale: 1.2 }],
+  [{ logoPath: SimplisafeLogo }, { logoPath: WoodMacLogo }],
+  [{ logoPath: YelpLogo }, { logoPath: VMwareLogo }],
+  [{ logoPath: ToastLogo, logoScale: 1.2 }],
 ];
 
-const mobileRows: string[][] = [
-  [GoogleLogo],
-  [CarGurusLogo],
-  [MetaLogo],
-  [DatadogLogo],
-  [SimplisafeLogo],
-  [WoodMacLogo],
-  [YelpLogo],
-  [VMwareLogo],
-  [ToastLogo],
+const mobileRows: LogoItem[][] = [
+  [{ logoPath: GoogleLogo }],
+  [{ logoPath: CarGurusLogo }],
+  [{ logoPath: MetaLogo }],
+  [{ logoPath: DatadogLogo, logoScale: 1.2 }],
+  [{ logoPath: SimplisafeLogo }],
+  [{ logoPath: WoodMacLogo }],
+  [{ logoPath: YelpLogo }],
+  [{ logoPath: VMwareLogo }],
+  [{ logoPath: ToastLogo, logoScale: 1.2 }],
 ];
 
 // generate single row of tickets
-function makeSponsorRow(ticketWidthVW: number, logos: string[]) {
+function makeSponsorRow(ticketWidthVW: number, logos: LogoItem[]) {
   return (
     <div
       className="flex justify-center"
@@ -59,10 +65,10 @@ function makeSponsorRow(ticketWidthVW: number, logos: string[]) {
       {logos.map((logo, i) => (
         <SponsorTicketComp
           key={i}
-          logoPath={logo}
+          logoPath={logo.logoPath}
           isSponsorUs={false}
           ticketWidthVW={ticketWidthVW}
-          logoScale={logoScaleMap[logo] ?? 1}
+          logoScale={logo.logoScale ?? 1}
         />
       ))}
     </div>
@@ -77,10 +83,10 @@ export default function PastSponsors(): JSX.Element {
   const boothWidth = isMobile ? 90 : isTablet ? 80 : 70;
 
   const ribbonStyles = clsx(
-    "w-1/2 flex justify-center",
-    isMobile && "mt-12 mb-6",
-    isTablet && "mt-16 mb-6",
-    isDesktop && "mt-20 mb-6",
+    "w-full flex justify-center",
+    isMobile && "mt-36 mb-10",
+    isTablet && "mt-48 mb-8",
+    isDesktop && "mt-64 mb-12"
   );
 
   return (
@@ -99,10 +105,12 @@ export default function PastSponsors(): JSX.Element {
       {/* Content overlay */}
       <div
         className="absolute top-0 left-0 w-full flex flex-col items-center text-white"
-        style={{ paddingTop: "12vw", gap: "5vw" }}
+        style={{ gap: "3vw" }}
       >
         <div className={ribbonStyles}>
-          <RibbonTitle text="Past Sponsors" />
+          <div className="w-full max-w-[720px] flex justify-center">
+            <RibbonTitle text="PAST SPONSORS" />
+          </div>
         </div>
 
         {/* Ticket Rows */}

From d9e7309334185cd3c39b72cd7b6db4f4d066a437 Mon Sep 17 00:00:00 2001
From: Alexandra Hu <108170281+allexandrahu@users.noreply.github.com>
Date: Thu, 1 Jan 2026 19:26:21 -0800
Subject: [PATCH 3/3] fix ribbon scaling

---
 .../SponsorComponents/SponsorTicketComp.tsx   |  1 -
 .../app/sponsor-us/Sections/PastSponsors.tsx  | 20 +++++++++++++------
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx b/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
index a93ffa71..1c21f44f 100644
--- a/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
+++ b/apps/main/src/app/lib/Components/SponsorComponents/SponsorTicketComp.tsx
@@ -29,7 +29,6 @@ export default function SponsorTicketComp({
       className="flex items-center justify-center relative"
       style={{ width: `${ticketWidthVW}vw`, height: "auto" }}
     >
-
       {logoPath && (
         <div
           className="absolute z-10 flex items-center justify-center overflow-hidden"
diff --git a/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx b/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
index d3ebc0ec..813bc062 100644
--- a/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
+++ b/apps/main/src/app/sponsor-us/Sections/PastSponsors.tsx
@@ -83,12 +83,14 @@ export default function PastSponsors(): JSX.Element {
   const boothWidth = isMobile ? 90 : isTablet ? 80 : 70;
 
   const ribbonStyles = clsx(
-    "w-full flex justify-center",
-    isMobile && "mt-36 mb-10",
-    isTablet && "mt-48 mb-8",
-    isDesktop && "mt-64 mb-12"
+    "flex justify-center",
+    isMobile && "w-[60%] mt-10 mb-8",
+    isTablet && "w-[50%] mt-14 mb-8",
+    isDesktop && "w-1/2 mt-20 mb-12"
   );
 
+  const ribbonScale = isMobile ? 0.6 : isTablet ? 0.8 : 1;
+
   return (
     <div className="relative w-full">
       {/* Background burst */}
@@ -105,10 +107,16 @@ export default function PastSponsors(): JSX.Element {
       {/* Content overlay */}
       <div
         className="absolute top-0 left-0 w-full flex flex-col items-center text-white"
-        style={{ gap: "3vw" }}
+        style={{ paddingTop: "3vw", gap: "3vw" }}
       >
         <div className={ribbonStyles}>
-          <div className="w-full max-w-[720px] flex justify-center">
+          <div
+            className="w-fit"
+            style={{
+              transform: `scale(${ribbonScale})`,
+              transformOrigin: "top center",
+            }}
+          >
             <RibbonTitle text="PAST SPONSORS" />
           </div>
         </div>