From 0d9fe0eaece4e8c029997f882d63d871e26e8121 Mon Sep 17 00:00:00 2001
From: itsfinniii <102350242+itsfinniii@users.noreply.github.com>
Date: Mon, 23 Mar 2026 19:34:43 +0100
Subject: [PATCH] Fix mobile responsiveness for Upcoming Events

---
 astro/src/components/web/UpcomingEvents.astro            | 4 ++--
 astro/src/components/web/subcomponents/UpcomingEvent.tsx | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/astro/src/components/web/UpcomingEvents.astro b/astro/src/components/web/UpcomingEvents.astro
index a368620..0b1f6c7 100644
--- a/astro/src/components/web/UpcomingEvents.astro
+++ b/astro/src/components/web/UpcomingEvents.astro
@@ -15,8 +15,8 @@ const upcomingEvents = Astro.props.upcomingEvents;
     
     <div class="flex flex-col items-start gap-7 w-full">
         { upcomingEvents.events.map((event) => (
-            <div id={event.id} class="flex flex-row items-center justify-center gap-y-8 gap-x-18">
-                <div class="lg:w-[40%] w-full">
+            <div id={event.id} class="flex lg:flex-row flex-col items-center justify-center lg:gap-y-8 gap-y-5 gap-x-18">
+                <div class="lg:w-[50%] w-full">
                     <Image
                         src={event.thumbnail.url}
                         width={event.thumbnail.width}
diff --git a/astro/src/components/web/subcomponents/UpcomingEvent.tsx b/astro/src/components/web/subcomponents/UpcomingEvent.tsx
index a113ea9..88098cd 100644
--- a/astro/src/components/web/subcomponents/UpcomingEvent.tsx
+++ b/astro/src/components/web/subcomponents/UpcomingEvent.tsx
@@ -17,7 +17,7 @@ export function upcomingEvent(props: { event: UpcomingEvent }) {
 
     return (
         <div>
-            <div className="hover:cursor-pointer text-indigo-400 underline" onClick={open}>{"Read more >>"}</div>
+            <div className="hover:cursor-pointer text-indigo-400 underline w-fit text-lg font-semibold" onClick={open}>{"Read more >>"}</div>
 
             { isOpen && (
                 <div