Merge pull request #151 from umdevclub/feat/google

Feat/google

Author: FawazBinSaleem

src/resources/data/devHacksArchive/HackathonYearSponsors.tsx

@@ -1,6 +1,12 @@
 import "@/styles/devHacksSponsors.scss";
 import React from "react";
 
+//2026 logos
+import Ubisoft2026 from "@/resources/images/devhacks/2025/devHacksSponsors/Ubisoft.jpg";
+import Niche2026 from "@/resources/images/devhacks/2025/devHacksSponsors/niche.png";
+import G3_2026 from "@/resources/images/devhacks/2025/devHacksSponsors/G3.png";
+import Pollard2026 from "@/resources/images/devhacks/2025/devHacksSponsors/pollard.jpg";
+
 // 2025 logos
 import Ubisoft from "@/resources/images/devhacks/2025/devHacksSponsors/Ubisoft.jpg";
 import Niche2025 from "@/resources/images/devhacks/2025/devHacksSponsors/niche.png";
@@ -28,22 +34,46 @@ import Ubisoft2023 from "@/resources/images/devhacks/2023/devHacksSponsors/Ubiso
 import GreenUmbrella from "@/resources/images/devhacks/2023/devHacksSponsors/greenUmbrella.webp";
 import PayWorks from "@/resources/images/devhacks/2023/devHacksSponsors/payWorks.jpg";
 
-type HackathonYearSponsorsProps = {
-  year: string | number;
+type HackathonYearSponsorsProps = { year: string | number };
+
+type Tier = "platinum" | "gold" | "silver" | "bronze" | "inkind";
+type Sponsor = { name: string; logo: string };
+type YearSponsors = Partial<Record<Tier, Sponsor[]>>;
+
+/** Optional: nicer titles per tier */
+const TIER_LABEL: Record<Tier, string> = {
+  platinum: "Platinum Sponsor",
+  gold: "Gold Sponsor",
+  silver: "Silver Sponsors",
+  bronze: "Bronze Sponsors",
+  inkind: "In-Kind Sponsors",
 };
 
+/** Render order */
+const TIER_ORDER: Tier[] = ["platinum", "gold", "silver", "bronze", "inkind"];
+
 const HackathonYearSponsors: React.FC<HackathonYearSponsorsProps> = ({
   year,
 }) => {
-  const sponsors: Record<
-    string,
-    {
-      gold: { name: string; logo: string };
-      silver: { name: string; logo: string }[];
-    }
-  > = {
+  const sponsorsByYear: Record<string, YearSponsors> = {
+    /* -------------------- 2026 -------------------- */
+    "2026": {
+      // platinum: [{ name: "Ubisoft", logo: Ubisoft2026 }],
+      gold: [{ name: "G3", logo: G3_2026 }],
+      silver: [
+        { name: "Niche", logo: Niche2026 },
+        { name: "Pollard", logo: Pollard2026 },
+      ],
+      //  inkind: [
+      //   {
+      //     name:"UMSU CARES", logo:umsuCares,
+      //   }
+      //  ],
+    },
+
+    /* -------------------- 2025 -------------------- */
     "2025": {
-      gold: { name: "Glitch Secure", logo: GlitchSecure },
+      gold: [{ name: "Glitch Secure", logo: GlitchSecure }],
       silver: [
         { name: "Varian", logo: Varian },
         { name: "Ubisoft", logo: Ubisoft },
@@ -56,8 +86,10 @@ const HackathonYearSponsors: React.FC<HackathonYearSponsorsProps> = ({
         { name: "FOS", logo: FOS },
       ],
     },
+
+    /* -------------------- 2024 -------------------- */
     "2024": {
-      gold: { name: "Priceline", logo: Priceline2024 },
+      gold: [{ name: "Priceline", logo: Priceline2024 }],
       silver: [
         { name: "Niche", logo: Niche2024 },
         { name: "G3", logo: G3_2024 },
@@ -67,8 +99,10 @@ const HackathonYearSponsors: React.FC<HackathonYearSponsorsProps> = ({
         { name: "KarveIT", logo: KarveIT },
       ],
     },
+
+    /* -------------------- 2023 -------------------- */
     "2023": {
-      gold: { name: "Neo", logo: Neo },
+      gold: [{ name: "Neo", logo: Neo }],
       silver: [
         { name: "Payworks", logo: PayWorks },
         { name: "Ubisoft", logo: Ubisoft2023 },
@@ -77,30 +111,30 @@ const HackathonYearSponsors: React.FC<HackathonYearSponsorsProps> = ({
     },
   };
 
-  const sponsorData = sponsors[String(year)];
-  if (!sponsorData) return null;
+  const data = sponsorsByYear[String(year)];
+  if (!data) return null;
 
   return (
     <div className="sponsors-container">
-      {/* Gold sponsor */}
-      <div className="gold-sponsor">
-        <img src={sponsorData.gold.logo} alt={sponsorData.gold.name} />
-      </div>
-
-      {/* Silver sponsors in rows of 3 */}
-      {Array.from({ length: Math.ceil(sponsorData.silver.length / 3) }).map(
-        (_, rowIndex) => (
-          <div key={rowIndex} className="sponsors-row">
-            {sponsorData.silver
-              .slice(rowIndex * 3, rowIndex * 3 + 3)
-              .map((sponsor, index) => (
-                <div key={index} className="sponsor">
-                  <img src={sponsor.logo} alt={sponsor.name} />
+      {TIER_ORDER.map((tier) => {
+        const list = data[tier];
+        if (!list || list.length === 0) return null;
+
+        return (
+          <div className={`tier tier--${tier}`} key={tier}>
+            <h2 className="tier-title">
+              {TIER_LABEL[tier] ?? tier[0].toUpperCase() + tier.slice(1)}
+            </h2>
+            <div className="tier-logos">
+              {list.map((s, i) => (
+                <div key={i} className="sponsor">
+                  <img src={s.logo} alt={s.name} loading="lazy" />
                 </div>
               ))}
+            </div>
           </div>
-        )
-      )}
+        );
+      })}
     </div>
   );
 };

src/resources/data/events.ts

@@ -10,9 +10,8 @@ import examCram from "@/resources/images/events/ExamCram.jpg";
 import devchamps from "@/resources/images/events/devchamps.jpeg";
 import labtours from "@/resources/images/events/Labtours.jpg";
 import codingKickoff from "@/resources/images/events/Coding Kickoff.png";
-import codingKickoffUpcoming from "@/resources/images/events/CodingKickoffUpcoming.png";
-import devgames1 from "@/resources/images/events/devgames1.png";
-import devgames2 from "@/resources/images/events/devgames2.png";
+import devgames3 from "@/resources/images/events/devgames 3.png";
+import google from "@/resources/images/events/resumeworkshop.png";
 
 export { TERMS_ORDER } from "./types";
 
@@ -52,6 +51,14 @@ export const EVENTS: EventData[] = [
     term: ["Fall", "Winter"],
     image: workshop,
     recurring: true,
+    upcomingTitle: "Resume Review with Google Talents",
+    upcomingDescription: [
+      "Join an industry panel featuring Google engineers as they review real student resumes live and share tips on what stands out to recruiters. The session will also include a Q&A and networking opportunities with professionals from the tech industry.",
+    ],
+    upcomingImage: google,
+    date: "2025-11-18T16:00:00",
+    location: "EITC E3-270",
+    rsvp: "https://docs.google.com/forms/d/e/1FAIpQLSeQ4ElP6kT1S7eUlr147fXRVJluoefPmufUzXmG1VYtyCxs4A/viewform?usp=send_form",
   },
   {
     id: "rendezvous",
@@ -70,15 +77,14 @@ export const EVENTS: EventData[] = [
     term: ["Fall"],
     image: devgames,
     recurring: true,
-    upcomingTitle: [".devGames Level 1", ".devGames Level 2"],
+    upcomingTitle: ".devGames Level 3",
     upcomingDescription: [
-      "Level 1: Learn the basics of game development in Unity.",
-      "Level 2: Join us for this special workshop in collaboration with UBISOFT and CSSA to learn about the fundamentals of Game Design.",
+      "In collaboration with UMSU CARES, learn how to make your games more accessible for all players. We'll explore features like Controller Support and Custom Keybindings, and discuss best practices for inclusive game design!",
     ],
-    upcomingImage: [devgames1, devgames2],
-    date: ["2025-09-25T17:00:00", "2025-10-01T17:00:00"],
-    location: ["EITC E2-155", "EITC E3-270"],
-    rsvp: "https://forms.gle/h7eHKcXw2wSrWCpUA",
+    upcomingImage: devgames3,
+    date: "2025-11-20T17:00:00",
+    location: "EITC E2-110",
+    rsvp: "https://forms.gle/37PJQLfcggXBn6eZ9",
   },
   {
     id: "exam-crams",

src/resources/images/events/CodingKickoffUpcoming.png

@@ -14,6 +14,7 @@ import HorizontalScroller from "@/components/HorizontalScroller";
 import GalleryScroller from "@/components/GalleryScroller";
 import { picturesGeneralImages } from "@/resources/data/devHacksArchive/PicturesGeneral";
 import { HackathonArchiveCards } from "@/routes/hackathon/HackathonArchiveCards";
+import HackathonYearSponsors from "@/resources/data/devHacksArchive/HackathonYearSponsors";
 
 function Hackathon() {
   // const btnStyles = {
@@ -158,8 +159,8 @@ function Hackathon() {
         </div>
       </div>
 
-      {/* <hi className="hackathon-sponsors heading">Our Sponsors:</hi>
-      <Sponsors /> */}
+      {/* <h1 className="hackathon-sponsors heading">Our Sponsors</h1>
+      <HackathonYearSponsors year={2026} /> */}
 
       <h1 className="hackathon-sponsors heading">Event Pictures</h1>
       <GalleryScroller images={picturesGeneralImages} />

src/resources/images/events/devgames 3.png

@@ -1,54 +1,91 @@
 .sponsors-container {
   display: flex;
+  font-family: "IBM Plex Mono", monospace;
   flex-direction: column;
   align-items: center;
   text-align: center;
-  gap: 20px;
+  gap: 28px;
   max-width: 100vh;
 }
 
-.sponsors-row {
+.tier {
+  width: 100%;
   display: flex;
-  justify-content: center;
-  gap: 15px;
+  flex-direction: column;
   align-items: center;
+  gap: 18px;
+}
+
+.tier-title {
+  font-family: "IBM Plex Mono", monospace;
+  font-size: clamp(1.1rem, 0.8rem + 1vw, 1.5rem);
+  letter-spacing: 0.06em;
+  // text-transform: uppercase;
+  opacity: 0.9;
 }
 
-.gold-sponsor {
+.tier-logos {
   display: flex;
   justify-content: center;
   align-items: center;
+  gap: 16px;
+  flex-wrap: wrap;
 }
 
 .sponsor img {
-  max-width: 150px;
   height: auto;
   object-fit: contain;
 }
 
-.gold-sponsor img {
-  max-width: 500px;
+/* tier-specific sizing */
+.tier--platinum .sponsor img {
+  max-width: 450px;
+}
+.tier--gold .sponsor img {
+  max-width: 320px;
+}
+.tier--silver .sponsor img {
+  max-width: 250px;
+}
+.tier--bronze .sponsor img {
+  max-width: 160px;
+}
+.tier--inkind .sponsor img {
+  max-width: 130px;
 }
 
 @media (max-width: 1024px) {
-  .sponsors-row {
-    flex-wrap: wrap;
+  .tier--platinum .sponsor img {
+    max-width: 420px;
   }
-  .sponsor img {
+  .tier--gold .sponsor img {
+    max-width: 360px;
+  }
+  .tier--silver .sponsor img {
+    max-width: 150px;
+  }
+  .tier--bronze .sponsor img {
     max-width: 120px;
   }
-  .gold-sponsor img {
-    max-width: 450px;
+  .tier--inkind .sponsor img {
+    max-width: 120px;
   }
 }
+
 @media (max-width: 768px) {
-  .sponsors-row {
-    flex-wrap: wrap;
+  .tier--platinum .sponsor img {
+    max-width: 320px;
   }
-  .sponsor img {
+  .tier--gold .sponsor img {
+    max-width: 260px;
+  }
+  .tier--silver .sponsor img {
+    max-width: 120px;
+  }
+  .tier--bronze .sponsor img {
     max-width: 100px;
   }
-  .gold-sponsor img {
-    max-width: 300px;
+  .tier--inkind .sponsor img {
+    max-width: 100px;
   }
 }