some more fixes in ui

curiousyuvi · Mar 7, 2023 · 9c96e13 · 9c96e13
1 parent da1911d
commit 9c96e13
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 328 deletions.
diff --git a/client/pages/create.tsx b/client/pages/create.tsx
@@ -19,6 +19,8 @@ export default function CreateRoom() {
     setRoomName(e.target.value);
   };
   const [validationIssue, setValidationIssue] = useState({ roomName: "" });
+  const [chatsHeight, setChatsHeight] = useState(0);
+
   const { successToast } = useToast();
 
   const createRoomMutation = useCreateRoom(() => {
@@ -70,11 +72,25 @@ export default function CreateRoom() {
     }
   };
 
+  useEffect(() => {
+    function handleResize() {
+      setChatsHeight(window.innerHeight - 120);
+    }
+
+    handleResize();
+    window.addEventListener("resize", handleResize);
+
+    return () => {
+      window.removeEventListener("resize", handleResize);
+    };
+  }, []);
+
   return (
     <div className="w-full h-full rounded-br-lg flex flex-col justify-start items-center gap-2 bg-blue-900/70">
       <form
         onSubmit={handleSubmit}
-        className="w-full h-[calc(100%] overflow-y-auto p-4 pb-12"
+        style={{ height: `${chatsHeight}px` }}
+        className="w-full overflow-y-auto p-4 pb-12"
       >
         <div className="w-full h-12 sm:h-24 flex justify-center items-center">
           <h1 className="text-gray-200 text-2xl sm:text-4xl py-1">

diff --git a/client/pages/room_test.tsx b/client/pages/room_test.tsx