fix(mobile): responsive design mobile mode

Author: osmancoskun

src/lib/layout/header.svelte

@@ -3,7 +3,7 @@
   let routes = ["download", "contact", "wiki"];
 </script>
 
-<div class="navbar bg-base-100 shadow-lg rounded-lg">
+<div class="navbar bg-base-100 shadow-md rounded-lg">
   <ul class="flex-1 menu menu-horizontal">
     <li>
       <a
@@ -39,9 +39,10 @@
             ></path></svg
           >
         </div>
+        <!-- svelte-ignore a11y-no-noninteractive-tabindex -->
         <ul
           tabindex="0"
-          class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box"
+          class="dropdown-content z-[1] menu p-2 shadow-md bg-base-100 rounded-box"
         >
           {#each routes as route}
             <li class="block md:hidden capitalize">

src/lib/layout/navigation.svelte

@@ -23,13 +23,15 @@
     <label for="my-drawer" aria-label="close sidebar" class="drawer-overlay"
     ></label>
     <ul class="menu menu-xs h-screen bg-base-200 max-w-xs w-full border-right">
-      <li class="flex-1">
-        {#if urls?.length > 0}
-          {#each urls as url}
-            <WikiLink NodeURLs={url} />
-          {/each}
-        {/if}
-      </li>
+      <div class="h-[calc(100vh-4rem)] overflow-y-auto">
+        <li class="md:flex-1">
+          {#if urls?.length > 0}
+            {#each urls as url}
+              <WikiLink NodeURLs={url} />
+            {/each}
+          {/if}
+        </li>
+      </div>
       <li>
         <a href="/" class="w-full flex justify-center btn btn-info">
           <IconArrowBackUp class="w-5 h-5" />

src/routes/download/index.svelte

@@ -8,7 +8,7 @@
 <main class="mt-10">
   <div class="w-full grid grid-cols-1 md:grid-cols-2 gap-5">
     {#each DownloadPageData as data}
-      <div class="card card-body shadow-xl rounded-md dark:bg-slate-800">
+      <div class="card card-body shadow-md rounded-md dark:bg-slate-800">
         <h1 class="font-bold text-xl">{data.label}</h1>
         <h1>ISO Files</h1>
         {#each data.iso as iso, isoindex}