fixed mobile

Vatsim-Scandinavia · Jul 11, 2024 · 4a5d9fa · 4a5d9fa
1 parent 3ddddd0
commit 4a5d9fa
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 9 deletions.
diff --git a/src/components/Events.astro b/src/components/Events.astro
@@ -2,14 +2,14 @@
 import CardButton from "../components/ui/CardButton.astro";
 ---
 
-<h2 class="font-semibold text-lg text-secondary mb-2 dark:text-white">Today</h2>
+<h2 class="font-semibold text-lg text-secondary mb-2 dark:text-white p-2">Today</h2>
 
-<div class="flex flex-col gap-4 w-screen md:w-full">
+<div class="flex flex-col gap-4 w-screen md:w-full p-2">
     <div class="flex flex-col md:flex-row justify-center gap-2">
         <img
         src="/img/events/cphlive2024.png"
         alt=""
-        class="w-[350px]"
+        class="w-full md:w-[350px]"
         />
         <div class="md:ml-4">
             <h3 class="text-secondary dark:text-white font-bold text-lg -mt-2">
@@ -22,11 +22,11 @@ import CardButton from "../components/ui/CardButton.astro";
         </div>
     </div>
 
-    <div class="flex flex-col md:flex-row justify-center gap-2">
+    <div class="flex flex-col md:flex-row justify-center md:items-center gap-2">
         <img
         src="/img/events/cphlive2024.png"
         alt=""
-        class="w-[350px]"
+        class="w-full md:w-[350px]"
         />
 
         <div class="md:ml-4">
@@ -45,8 +45,8 @@ import CardButton from "../components/ui/CardButton.astro";
     </div>
 </div>
 
-<h2 class="font-semibold text-lg text-secondary mt-8 mb-2 dark:text-white">Upcoming</h2>
-<div class="flex flex-row gap-2 overflow-x-scroll">
+<h2 class="font-semibold text-lg text-secondary mt-8 mb-2 dark:text-white p-2">Upcoming</h2>
+<div class="flex flex-row gap-2 overflow-x-scroll p-4">
     <img
     src="/img/events/procdctreg.png"
     alt=""

diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -18,7 +18,7 @@ allAnnouncements.sort((a, b) => new Date(b.data.date).getTime() - new Date(a.dat
         <div class="w-full h-[calc(50vh)] flex justify-center mt-[150px]" >
             <div class="max-w-[1300px] w-full h-full flex">
                 <div class="w-full flex flex-col items-center justify-center p-12 font-bold">
-                    <h1 class="text-secondary dark:text-white text-xl md:text-4xl 2xl:text-6xl text-center drop-shadow-xl">
+                    <h1 class="text-secondary dark:text-white text-4xl 2xl:text-6xl text-center drop-shadow-xl">
                         Serving the Scandinavian skies 
                     </h1>
                     <p class="mt-12 sm:mt-0 text-secondary dark:text-white text-xl p-2 text-center w-full md:w-3/5 lg:w-full drop-shadow-xl font-medium">
@@ -63,7 +63,7 @@ allAnnouncements.sort((a, b) => new Date(b.data.date).getTime() - new Date(a.dat
                             )}
                         </CardBox>
 
-                        <CardBox title="Events" padding="4">
+                        <CardBox title="Events">
                             <Events/>
                         </CardBox>
                     </div>