From d20aa6af775742211fa7c7c58f45dc5d7e8f0379 Mon Sep 17 00:00:00 2001
From: Hadi <112569860+anotherhadi@users.noreply.github.com>
Date: Sat, 7 Mar 2026 14:55:40 +0100
Subject: [PATCH] Better responsive

Signed-off-by: Hadi <112569860+anotherhadi@users.noreply.github.com>
---
 src/components/DefaultView.svelte | 2 +-
 src/components/Result.svelte      | 2 +-
 src/layouts/Layout.astro          | 5 +++--
 src/pages/api-docs.astro          | 2 +-
 4 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/DefaultView.svelte b/src/components/DefaultView.svelte
index 3ee7c2e..ab32bba 100644
--- a/src/components/DefaultView.svelte
+++ b/src/components/DefaultView.svelte
@@ -84,7 +84,7 @@
   </div>
 
   <div class="card bg-base-200 border border-white/5 md:col-span-2">
-    <div class="card-body flex-row items-center gap-6">
+    <div class="card-body flex-col md:flex-row items-center gap-6">
       <div class="flex-1">
         <h2
           class="card-title text-accent font-mono uppercase text-sm tracking-widest"
diff --git a/src/components/Result.svelte b/src/components/Result.svelte
index 5d8515a..8a4f19c 100644
--- a/src/components/Result.svelte
+++ b/src/components/Result.svelte
@@ -61,7 +61,7 @@
         </div>
       </div>
 
-      <div class="min-w-0 flex-1">
+      <div class="min-w-0 flex-1 flex flex-col gap-2">
         <div class="flex items-center gap-2">
           <span
             class="text-[10px] font-black uppercase tracking-widest opacity-50 truncate"
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 174d98d..2bbb926 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -55,10 +55,11 @@ const myLinks = [
         href="https://ko-fi.com/anotherhadi"
         slot="action"
         target="_blank"
-        class="btn btn-primary"><Coffee class="size-5" /> Support me</a
+        class="btn btn-primary btn-sm md:btn-md"
+        ><Coffee class="size-5" /> Support me</a
       >
     </Navbar>
-    <div class="m-auto max-w-5xl py-10 px-10 animate-fade-in">
+    <div class="m-auto max-w-5xl md:py-10 md:px-10 py-5 px-5 animate-fade-in">
       <slot />
     </div>
   </body>
diff --git a/src/pages/api-docs.astro b/src/pages/api-docs.astro
index 4559774..b0a9fde 100644
--- a/src/pages/api-docs.astro
+++ b/src/pages/api-docs.astro
@@ -4,7 +4,7 @@ import { Terminal, Settings, Database, Info, Code } from "lucide-svelte";
 ---
 
 <Layout title="API Documentation">
-  <main class="max-w-4xl mx-auto p-6 space-y-12 my-10">
+  <main class="space-y-12">
     <header class="space-y-4 border-b border-white/5 pb-8">
       <h1
         class="text-5xl font-black uppercase tracking-tighter flex items-center gap-4 text-primary"