From 9842073fe4e538bf49af93384d12b37636fe0c71 Mon Sep 17 00:00:00 2001
From: Bianca <ianoselbiancaroberta02@gmail.com>
Date: Fri, 22 May 2026 10:15:37 +0200
Subject: [PATCH 1/3] feat: add Hero component and integrate it into
 Associations, CommunityNews, and Deprecated pages

---
 src/app/associations/page.tsx              | 19 ++++++-------------
 src/components/projects/collection.tsx     |  2 +-
 src/components/projects/community-news.tsx | 10 ++--------
 src/components/projects/deprecated.tsx     |  2 +-
 src/components/ui/hero.tsx                 | 12 ++++++++++++
 5 files changed, 22 insertions(+), 23 deletions(-)
 create mode 100644 src/components/ui/hero.tsx

diff --git a/src/app/associations/page.tsx b/src/app/associations/page.tsx
index e0553bb..df87e64 100644
--- a/src/app/associations/page.tsx
+++ b/src/app/associations/page.tsx
@@ -12,6 +12,7 @@ import {
   FiYoutube,
 } from "react-icons/fi"
 import AccordionAssociation from "@/components/accordion-association"
+import { Hero } from "@/components/ui/hero"
 import esnLogo from "../../../public/logos/esn.svg"
 
 const accordionItems = [
@@ -158,19 +159,11 @@ const accordionItems = [
 
 export default function AssociationsPage() {
   return (
-    <main className="w-full">
-      <div className="mx-auto flex min-h-screen max-w-400 flex-col items-center justify-center gap-20 px-4 py-49 md:gap-39">
-        <div className="flex flex-col items-center gap-6">
-          <h2 className="typo-display-large md:typo-display-extralarge w-fit bg-linear-to-b from-text-primary to-text-secondary bg-clip-text text-transparent md:py-14">
-            Associazioni
-          </h2>
-          <p className="typo-title-large md:typo-headline-small max-w-2xl text-center">
-            Scopri le associazioni studentesche del Politecnico
-          </p>
-        </div>
-        <div className="w-full max-w-300">
-          <AccordionAssociation accordionItems={accordionItems} defaultValue="ESN - Erasmus Student Network" />
-        </div>
+    <main className="mx-auto flex min-h-screen w-full max-w-400 flex-col items-center justify-center gap-20 px-4 py-49 md:gap-39">
+      <Hero title="Associazioni" description="Scopri le associazioni studentesche del Politecnico" />
+
+      <div className="w-full max-w-300">
+        <AccordionAssociation accordionItems={accordionItems} defaultValue="ESN - Erasmus Student Network" />
       </div>
     </main>
   )
diff --git a/src/components/projects/collection.tsx b/src/components/projects/collection.tsx
index 81221e0..81c651d 100644
--- a/src/components/projects/collection.tsx
+++ b/src/components/projects/collection.tsx
@@ -83,7 +83,7 @@ export function Collection() {
       </div>
 
       <div className="hidden flex-col gap-12 sm:flex">
-        <div className="grid grid-cols-2 justify-items-center gap-6 xl:grid-cols-4">
+        <div className="grid 1xl:grid-cols-4 grid-cols-2 justify-items-center gap-6">
           {collectionCards.map((card) => (
             <CardCaption key={card.title} {...card} />
           ))}
diff --git a/src/components/projects/community-news.tsx b/src/components/projects/community-news.tsx
index f5881ff..1aa9e9b 100644
--- a/src/components/projects/community-news.tsx
+++ b/src/components/projects/community-news.tsx
@@ -1,6 +1,7 @@
 import { FiCrop } from "react-icons/fi"
 import { CardCaption } from "../card-caption"
 import { Carousel, CarouselContent, CarouselDots, CarouselItem } from "../ui/carousel"
+import { Hero } from "../ui/hero"
 
 const communityCards = [
   {
@@ -36,14 +37,7 @@ const communityCards = [
 export function CommunityNews() {
   return (
     <section className="mx-auto flex min-h-screen max-w-400 flex-col items-center justify-center gap-48 px-4 py-49">
-      <div className="flex flex-col items-center gap-6">
-        <h2 className="typo-display-large sm:typo-display-extralarge w-fit bg-linear-to-b from-text-primary to-text-secondary bg-clip-text py-4 text-transparent sm:py-14">
-          Projects
-        </h2>
-        <p className="typo-title-large sm:typo-headline-small max-w-xl text-center">
-          Esplora e contribuisci ai progetti degli studenti
-        </p>
-      </div>
+      <Hero title="Projects" description=" Esplora e contribuisci ai progetti degli studenti" />
 
       <div className="mx-auto flex w-full flex-col gap-14 sm:w-fit">
         <div className="flex flex-col items-center gap-2 sm:items-start">
diff --git a/src/components/projects/deprecated.tsx b/src/components/projects/deprecated.tsx
index ebff0a9..67a3c07 100644
--- a/src/components/projects/deprecated.tsx
+++ b/src/components/projects/deprecated.tsx
@@ -47,7 +47,7 @@ export function Deprecated() {
         </div>
 
         <div className="hidden flex-col gap-12 sm:flex">
-          <div className="grid grid-cols-2 justify-items-center gap-6 xl:grid-cols-4">
+          <div className="grid 1xl:grid-cols-4 grid-cols-2 justify-items-center gap-6">
             {communityCards.map((card) => (
               <CardCaption key={card.title} {...card} />
             ))}
diff --git a/src/components/ui/hero.tsx b/src/components/ui/hero.tsx
new file mode 100644
index 0000000..af6de27
--- /dev/null
+++ b/src/components/ui/hero.tsx
@@ -0,0 +1,12 @@
+export function Hero({ title, description }: { title: string; description: string }) {
+    return (
+        <div className="flex flex-col items-center gap-6">
+            <h2 className="typo-display-large sm:typo-display-extralarge w-fit bg-linear-to-b from-text-primary to-text-secondary bg-clip-text py-4 text-transparent sm:py-14">
+                {title}
+            </h2>
+            <p className="typo-title-large sm:typo-headline-small max-w-2xl text-center">
+                {description}
+            </p>
+        </div>
+    )
+}
\ No newline at end of file

From f2f6ea3cb1e4d0813a771ffc98aed9ae49802587 Mon Sep 17 00:00:00 2001
From: Bianca <ianoselbiancaroberta02@gmail.com>
Date: Fri, 22 May 2026 10:18:53 +0200
Subject: [PATCH 2/3] feat: remove unused CarouselMock component from Home page

---
 src/components/home/carousel-mock.tsx | 49 ---------------------------
 1 file changed, 49 deletions(-)
 delete mode 100644 src/components/home/carousel-mock.tsx

diff --git a/src/components/home/carousel-mock.tsx b/src/components/home/carousel-mock.tsx
deleted file mode 100644
index c4f9758..0000000
--- a/src/components/home/carousel-mock.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-"use client"
-
-import { CardCaption } from "@/components/card-caption"
-import { Carousel, CarouselContent, CarouselDots, CarouselItem } from "@/components/ui/carousel"
-
-const mockCards = [
-  {
-    title: "WeBeepSync",
-    caption:
-      "WeBeep Sync è una semplice app, user-friendly e senza compromessi che serve per tenere sincronizzati tutti i tuoi file di WeBeep.",
-  },
-  {
-    title: "PolimiSchedule",
-    caption:
-      "Genera un file iCalendar (.ics) a partire dal formato testuale dell’Orario delle lezioni. Possibilità di importare su Google Calendar.",
-  },
-  {
-    title: "WiFiLinux",
-    caption: "Scarica ed esegui lo script Python per attivare la connessione permanente al WiFi Polimi.",
-  },
-  {
-    title: "The TOL Project",
-    caption: "Un simulatore gratuito del test di ammissione per le aspiranti matricole di Ingegneria del PoliMi.",
-  },
-] as const
-
-// TODO: delete this when merging
-export function CarouselMock() {
-  return (
-    <section className="mx-auto flex min-h-screen w-full max-w-4xl flex-col items-center justify-center gap-16 px-7.5">
-      <h1 className="typo-headline-medium sm:typo-display-large bg-linear-to-r from-text-primary via-blue-secondary to-blue-primary bg-clip-text text-transparent">
-        PoliNetwork
-      </h1>
-
-      <Carousel className="w-full">
-        <CarouselContent>
-          {mockCards.map((card) => (
-            <CarouselItem key={card.title}>
-              <div className="flex justify-center">
-                <CardCaption {...card} />
-              </div>
-            </CarouselItem>
-          ))}
-        </CarouselContent>
-        <CarouselDots className="mt-8" />
-      </Carousel>
-    </section>
-  )
-}

From c77ef1d8fdf746a62799180d09261fac9b3af2ad Mon Sep 17 00:00:00 2001
From: Bianca <ianoselbiancaroberta02@gmail.com>
Date: Fri, 22 May 2026 10:20:19 +0200
Subject: [PATCH 3/3] style: format Hero component for improved readability

---
 src/components/ui/hero.tsx | 20 +++++++++-----------
 1 file changed, 9 insertions(+), 11 deletions(-)

diff --git a/src/components/ui/hero.tsx b/src/components/ui/hero.tsx
index af6de27..d4ebc4b 100644
--- a/src/components/ui/hero.tsx
+++ b/src/components/ui/hero.tsx
@@ -1,12 +1,10 @@
 export function Hero({ title, description }: { title: string; description: string }) {
-    return (
-        <div className="flex flex-col items-center gap-6">
-            <h2 className="typo-display-large sm:typo-display-extralarge w-fit bg-linear-to-b from-text-primary to-text-secondary bg-clip-text py-4 text-transparent sm:py-14">
-                {title}
-            </h2>
-            <p className="typo-title-large sm:typo-headline-small max-w-2xl text-center">
-                {description}
-            </p>
-        </div>
-    )
-}
\ No newline at end of file
+  return (
+    <div className="flex flex-col items-center gap-6">
+      <h2 className="typo-display-large sm:typo-display-extralarge w-fit bg-linear-to-b from-text-primary to-text-secondary bg-clip-text py-4 text-transparent sm:py-14">
+        {title}
+      </h2>
+      <p className="typo-title-large sm:typo-headline-small max-w-2xl text-center">{description}</p>
+    </div>
+  )
+}