fixed mobile css

Author: RibaDiba

src/lib/components/LandingPage.svelte

@@ -133,7 +133,7 @@
 <main class="relative z-1 flex justify-center items-center text-center min-h-screen w-screen flex-col px-4 py-8 md:py-10">
 
   <div class="my-2 md:my-0">
-      <img src="./images/hackJPS-logo.png" alt="HACKJPS-LOGO" class="h-[250px] md:h-[400px] max-w-full">
+      <img src="./images/hackJPS-logo.png" alt="HACKJPS-LOGO" class="h-[250px] md:h-[400px] max-w-full pt-10 md:pt-0">
   </div>
 
     <div class="md:text-7xl text-4xl font-mono font-bold text-green-300 pt-0 md:pt-0 mb-5">
@@ -151,33 +151,33 @@
 
   <div class="flex flex-col md:flex-row justify-center mt-6 md:mt-10 gap-4 md:gap-5 w-full md:w-fit px-4 md:px-0">
     <a href="https://discord.gg/KCU5qG7R9m" class="w-full md:w-auto">
-        <GradientButton outline color="cyanToBlue" class="w-full">
-            <div class="gap-2 md:gap-3 p-2 flex items-center justify-center">
-                <img src="./images/discord-logo.png" alt="Discord" class="h-[18px] md:h-[24px]">
+        <GradientButton outline color="cyanToBlue" class="w-full text-xs md:text-base">
+            <div class="gap-2 md:gap-3 p-0 md:p-2 flex items-center justify-center">
+                <img src="./images/discord-logo.png" alt="Discord" class="h-[14px] md:h-[24px]">
                 <div class="text-white text-sm md:text-lg">Discord</div>
             </div>
         </GradientButton>
     </a>
     <a href="https://hackjps25.devpost.com" class="w-full md:w-auto">       
-        <GradientButton outline color="purpleToPink" class="w-full">
-            <div class="gap-2 md:gap-3 p-2 flex items-center justify-center">
-                <img src="./images/devpost-logo.png" alt="Devpost" class="h-[18px] md:h-[24px]">
+        <GradientButton outline color="purpleToPink" class="w-full text-xs md:text-base">
+            <div class="gap-2 md:gap-3 p-0 md:p-2 flex items-center justify-center">
+                <img src="./images/devpost-logo.png" alt="Devpost" class="h-[14px] md:h-[24px]">
                 <div class="text-white text-sm md:text-lg">Devpost</div>
             </div>
         </GradientButton>
     </a>
     <a href={'#archive'} class="w-full md:w-auto">
-        <GradientButton outline color="pinkToOrange" class="w-full" on:click={() => {dispatch('about', '#archive')}}> 
-            <div class="gap-2 md:gap-3 p-2 flex items-center justify-center">
-                <img src="./images/archive-icon.png" alt="Archive" class="h-[18px] md:h-[24px]">
+        <GradientButton outline color="pinkToOrange" class="w-full text-xs md:text-base" on:click={() => {dispatch('about', '#archive')}}> 
+            <div class="gap-2 md:gap-3 p-0 md:p-2 flex items-center justify-center">
+                <img src="./images/archive-icon.png" alt="Archive" class="h-[14px] md:h-[24px]">
                 <div class="text-white text-sm md:text-lg">Archive</div>
             </div>
         </GradientButton>
     </a>
     <a href="https://forms.gle/3iSLSnSrwBHXd1jXA">
-        <GradientButton outline color="teal" class="w-full">
-            <div class="gap-2 md:gap-3 p-2 flex items-center justify-center">
-                <img src="./images/google-forms-logo.png" alt="" class="h-[18px] md:h-[24px]">
+        <GradientButton outline color="teal" class="w-full text-xs md:text-base">
+            <div class="gap-2 md:gap-3 p-0 md:p-2 flex items-center justify-center">
+                <img src="./images/google-forms-logo.png" alt="" class="h-[14px] md:h-[24px]">
                 <div class="text-white text-sm md:text-lg">Register</div>
             </div>
         </GradientButton>