responsive

Vatsim-Scandinavia · Aug 26, 2024 · 0d56aeb · 0d56aeb
1 parent 4cac2cb
commit 0d56aeb
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/src/pages/va.astro b/src/pages/va.astro
@@ -14,13 +14,13 @@ import '../globals.css'
         <title>Copenhagen Live</title>
         <ViewTransitions />
       </head>
-    <body class="bg-[#f3f1ed] bg-[url('/skies.svg')] bg-cover w-screen h-full min-h-screen flex gap-8 justify-center items-center p-8" >
-        <div class="w-full h-full flex flex-col justify-center items-center bg-[#f3f1ed]">
+    <body class="bg-[#f3f1ed] bg-[url('/skies.svg')] bg-cover w-screen h-full min-h-screen flex flex-wrap m-8" >
+        <div class="flex flex-col justify-center items-center basis-1/1 2xl:basis-1/3 p-4 w-full 2xl:w-fit min-w-[800px] h-fit">
             <div class="bg-[#272c88] w-full p-4 rounded flex justify-center">
                 <img src="/vSAS_light.png" class="h-32 p-4" />
             </div>
-            <div class="bg-[#ffffff] w-full p-4 rounded flex justify-around h-full gap-8">
-                <div class="flex gap-4 flex-col">
+            <div class="bg-[#ffffff] w-full p-4 rounded flex flex-col 2xl:flex-row justify-center items-center h-full gap-8">
+                <div class="flex gap-4 flex-col ">
                     <h2 class="text-2xl text-center font-medium">vSAS is hosting a triangle group fligh!</h2>
                     <div class="bg-white w-96 mx-4 h-20 flex justify-between rounded-lg drop-shadow">
                         <div class="flex flex-col justify-center items-center h-20 aspect-square">
@@ -72,7 +72,7 @@ import '../globals.css'
                 </div>
             </div>
         </div>
-        <div class="bg-gray-100 w-full h-full flex flex-col justify-center items-center">
+        <div class="flex flex-col justify-center items-center basis-1/1 2xl:basis-1/3 p-4 w-full 2xl:w-fit min-w-[800px] h-fit">
             <div class="bg-[#05164d] w-full p-4 rounded flex justify-center">
                 <img src="https://lh-virtual.com/wp-content/uploads/2022/12/full-hd_transparent_logo_white-300x71.png" class="h-32 p-4" />
             </div>
@@ -115,7 +115,7 @@ import '../globals.css'
                 </div>
             </div>
         </div>
-        <div class="w-full h-full flex flex-col justify-center items-center bg-[#f3f1ed]">
+        <div class="flex flex-col justify-center items-center basis-1/1 2xl:basis-1/3 p-4 w-full 2xl:w-fit min-w-[800px] h-fit">
             <div class="bg-[#2b2b2b] w-full p-4 rounded flex justify-center">
                 <img src="https://cdn.vamsys.xyz/phoenixMediaStore/logo_select_page_dark/24620/c/vEZY_White_2022-logo.png" class="h-32 p-4" />
             </div>