cleanup: more responsive on smaller screens

Vanilla-OS · Aug 5, 2024 · 1f16fc9 · 1f16fc9
1 parent 99cc3f4
commit 1f16fc9
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/src/views/NotFoundView.vue b/src/views/NotFoundView.vue
@@ -6,8 +6,8 @@
             <p class="mt-4">The page you are looking for does not exist.</p>
         </div>
     </section>
-    <section class="text-center mt-10 flex gap-6 flex-col w-[50%] mx-auto items-center justify-center">
+    <section class="text-center mt-10 flex gap-6 flex-col lg:w-[55%] mx-auto sm:w-full items-center justify-center">
     <img src="https://i.imgflip.com/6pvb0b.png" alt="404" class="rounded-xl w-[85%]">
-    <a href="/" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded mt-6 w-[20%]">Go Home</a>
+    <a href="/" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded mt-6 sm:w-[50%] md:w-[30%] lg:w-[20%]">Go Home</a>
     </section>
 </template>