diff --git a/components/shared/Chat/v2/Chat.tsx b/components/shared/Chat/v2/Chat.tsx
index bd4c8f3f..5f05911f 100644
--- a/components/shared/Chat/v2/Chat.tsx
+++ b/components/shared/Chat/v2/Chat.tsx
@@ -12,6 +12,7 @@ export type ChatProps = {
   lobbyMessages: MessageType[];
   friendList: FriendType[];
   roomMessages: MessageType[];
+  maxHeight?: string;
 };
 
 export default function Chat({
@@ -19,6 +20,7 @@ export default function Chat({
   lobbyMessages,
   friendList,
   roomMessages,
+  maxHeight = "calc(100vh - 10rem)",
 }: Readonly<ChatProps>) {
   const [messages, setMessages] = useState(lobbyMessages);
   const [target, setTarget] = useState<[ChatTab["id"], string | null]>([
@@ -70,7 +72,7 @@ export default function Chat({
   return (
     <div
       className="w-[308px] h-[var(--chat-height))] gradient-purple rounded-lg"
-      style={{ "--chat-height": "calc(100vh - 10rem)" } as CSSProperties}
+      style={{ "--chat-height": maxHeight } as CSSProperties}
     >
       <div className="h-full body-bg border border-transparent bg-clip-padding rounded-lg overflow-hidden">
         <ChatHeader
diff --git a/components/shared/Chat/v2/ChatHeader.tsx b/components/shared/Chat/v2/ChatHeader.tsx
index aed32e00..e5d04ad5 100644
--- a/components/shared/Chat/v2/ChatHeader.tsx
+++ b/components/shared/Chat/v2/ChatHeader.tsx
@@ -32,7 +32,7 @@ export default function ChatHeader({
             )}
             onClick={toggleTab(id)}
           >
-            {notifications && (
+            {Number(notifications) > 0 && (
               <span className="absolute right-0 -top-2 fz-12 w-4 h-4 leading-4 rounded-full bg-secondary-500 text-basic-white">
                 {notifications}
               </span>
diff --git a/components/shared/SearchBar/SearchBar.tsx b/components/shared/SearchBar/SearchBar.tsx
index 57747926..3ad93817 100644
--- a/components/shared/SearchBar/SearchBar.tsx
+++ b/components/shared/SearchBar/SearchBar.tsx
@@ -38,7 +38,7 @@ export const SearchBar = ({
           {leftSlot}
           <input
             role="search"
-            className="py-2.5 px-4 leading-normal rounded-full bg-white/8 flex-1 text-primary-200"
+            className="py-2.5 px-4 leading-normal rounded-full bg-white/8 flex-1 text-primary-200 focus-within:outline-0"
             placeholder={placeholder}
             value={value}
             onChange={(e) => setValue(e.target.value)}
diff --git a/components/shared/Sidebar.tsx b/components/shared/Sidebar.tsx
index 477852e5..2a54d719 100644
--- a/components/shared/Sidebar.tsx
+++ b/components/shared/Sidebar.tsx
@@ -30,7 +30,7 @@ export default function Sidebar() {
   ];
 
   return (
-    <nav className="flex flex-col shrink-0 justify-start bg-white/8 glass-shadow my-6 ms-1.5 py-6 rounded-2xl w-18 gap-5">
+    <nav className="flex flex-col justify-start bg-white/8 glass-shadow py-6 rounded-2xl w-18 h-full gap-5">
       {buttons.map((ButtonProps) => (
         <Link
           href={ButtonProps.route}
diff --git a/pages/_document.tsx b/pages/_document.tsx
index b62948be..181899f6 100644
--- a/pages/_document.tsx
+++ b/pages/_document.tsx
@@ -12,7 +12,7 @@ export default function Document() {
         <meta name="og:title" content={siteTitle} />
         <meta name="twitter:card" content="summary_large_image" />
       </Head>
-      <body className="body-bg">
+      <body className="body-bg overflow-hidden">
         <Main />
         <NextScript />
       </body>
diff --git a/tailwind.config.js b/tailwind.config.js
index 30dd5f66..6af164fd 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -5,6 +5,7 @@ module.exports = {
   content: [
     "./pages/**/*.{js,ts,jsx,tsx}",
     "./components/**/*.{js,ts,jsx,tsx}",
+    "./containers/**/*.{js,ts,jsx,tsx}",
   ],
   theme: {
     fontFamily: {
