diff --git a/web/src/components/NavigationDrawer.tsx b/web/src/components/NavigationDrawer.tsx
index 563d246c..e59cbbad 100644
--- a/web/src/components/NavigationDrawer.tsx
+++ b/web/src/components/NavigationDrawer.tsx
@@ -26,7 +26,7 @@ const NavigationDrawer = () => {
         <Icon.Menu className="w-5 h-auto dark:text-gray-200" />
       </IconButton>
       <Drawer anchor="left" size="sm" open={open} onClose={toggleDrawer(false)}>
-        <div className="w-full px-4">
+        <div className="w-full h-full px-4 bg-zinc-100 dark:bg-zinc-800">
           <Navigation />
         </div>
       </Drawer>
diff --git a/web/src/pages/SignIn.tsx b/web/src/pages/SignIn.tsx
index a9f411c8..80899b1e 100644
--- a/web/src/pages/SignIn.tsx
+++ b/web/src/pages/SignIn.tsx
@@ -104,7 +104,7 @@ const SignIn = () => {
   };
 
   return (
-    <div className="py-8 w-80 max-w-full min-h-[100svh] mx-auto flex flex-col justify-start items-center">
+    <div className="py-4 sm:py-8 w-80 max-w-full min-h-[100svh] mx-auto flex flex-col justify-start items-center">
       <div className="w-full py-4 grow flex flex-col justify-center items-center">
         <div className="w-full flex flex-row justify-center items-center mb-6">
           <img className="h-14 w-auto rounded-full shadow" src={systemStatus.customizedProfile.logoUrl} alt="" />
diff --git a/web/src/pages/SignUp.tsx b/web/src/pages/SignUp.tsx
index ec6e8a1a..790801cb 100644
--- a/web/src/pages/SignUp.tsx
+++ b/web/src/pages/SignUp.tsx
@@ -70,7 +70,7 @@ const SignUp = () => {
   };
 
   return (
-    <div className="py-8 w-80 max-w-full min-h-[100svh] mx-auto flex flex-col justify-start items-center">
+    <div className="py-4 sm:py-8 w-80 max-w-full min-h-[100svh] mx-auto flex flex-col justify-start items-center">
       <div className="w-full py-4 grow flex flex-col justify-center items-center">
         <div className="w-full flex flex-row justify-center items-center mb-6">
           <img className="h-14 w-auto rounded-full shadow" src={systemStatus.customizedProfile.logoUrl} alt="" />