diff --git a/frontend/src/components/useSocket.ts b/frontend/src/components/useSocket.ts
index 4efd27a..abbf6e4 100644
--- a/frontend/src/components/useSocket.ts
+++ b/frontend/src/components/useSocket.ts
@@ -61,7 +61,7 @@ function useSocket({ notify }: UseSocketProps): UseSocketResult {
   }[readyState] as Status;
 
   useEffect(() => {
-    if (readyState === WebSocket.CLOSED || readyState === WebSocket.CLOSING) {
+    if (connectionStatus === "closing" || connectionStatus === "closed") {
       setId(null);
       setDownloads(null);
       setExecutables(null);
diff --git a/frontend/src/pages/index.astro b/frontend/src/pages/index.astro
index 46adf00..156bd32 100644
--- a/frontend/src/pages/index.astro
+++ b/frontend/src/pages/index.astro
@@ -6,7 +6,7 @@ import Demo from "@/components/Demo";
 <Base>
   <div class="w-screen min-h-screen flex flex-col items-center middle">
     <div
-      class="noise-card rounded-sm relative z-20 border-zinc-700 md:border w-full max-w-[40rem] max-sm:h-full min-h-[618.5px] md:mt-16 shadow-lg"
+      class="noise-card rounded-sm relative z-20 border-zinc-700 md:border w-full max-w-screen-sm max-sm:min-h-screen max-sm:h-full min-h-[618.5px] sm:mb-8 sm:mt-16 shadow-lg"
       style={{
         backgroundPosition:
           Math.random() * 100 + "px " + Math.random() * 100 + "px",