From 276b490e37839595a28a0743b6e0beff86561b9f Mon Sep 17 00:00:00 2001
From: Pihkaal <pihkaal@proton.me>
Date: Fri, 13 Sep 2024 20:00:45 +0200
Subject: [PATCH] feat: smaller outer padding on small devices

---
 src/App.tsx                    | 6 +++---
 src/components/Music/index.tsx | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 5d77047..0990d96 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -33,12 +33,12 @@ const AppRoot = () => {
           <Sddm />
         ) : (
           <div className="h-full flex-col">
-            <div className="relative z-10 px-2 py-2">
+            <div className="relative z-10 p-1 md:p-2">
               <Waybar />
             </div>
 
-            <div className="relative flex h-[calc(100%-50px)] w-full flex-col">
-              <Kitty className="w-full flex-1 pb-1 pl-2 pr-2 pt-1">
+            <div className="relative flex h-[calc(100svh-39px)] w-full flex-col md:h-[calc(100svh-50px)]">
+              <Kitty className="w-full flex-1 px-1 pt-1 md:px-2 md:pb-1">
                 <Nvim />
               </Kitty>
 
diff --git a/src/components/Music/index.tsx b/src/components/Music/index.tsx
index 06e23de..57f15af 100644
--- a/src/components/Music/index.tsx
+++ b/src/components/Music/index.tsx
@@ -67,7 +67,7 @@ export const Music = () => {
     <div className="flex flex-row pb-1">
       <Kitty
         className={cn(
-          "h-full pb-2 pl-2 pr-1 pt-1",
+          "h-full pb-1.5 pl-1 pr-1 pt-1 md:px-2",
           screenWidth < 900 ? "w-full" : "w-1/2",
         )}
         rows={5}