From a88eb5690fe3dd33de98703ad2e2f5d7fc256d36 Mon Sep 17 00:00:00 2001
From: Szymon Szlachtowicz <38212223+Szymx95@users.noreply.github.com>
Date: Fri, 15 Oct 2021 10:09:31 +0200
Subject: [PATCH] Fix narrow topbar (#71)

---
 packages/react-chat/src/components/Chat/ChatBody.tsx          | 4 ----
 .../react-chat/src/components/NarrowMode/NarrowChannels.tsx   | 2 +-
 .../react-chat/src/components/NarrowMode/NarrowMembers.tsx    | 2 +-
 .../react-chat/src/components/NarrowMode/NarrowTopbar.tsx     | 1 -
 4 files changed, 2 insertions(+), 7 deletions(-)

diff --git a/packages/react-chat/src/components/Chat/ChatBody.tsx b/packages/react-chat/src/components/Chat/ChatBody.tsx
index 950c722f..d2e6cef1 100644
--- a/packages/react-chat/src/components/Chat/ChatBody.tsx
+++ b/packages/react-chat/src/components/Chat/ChatBody.tsx
@@ -182,11 +182,7 @@ const ChatTopbar = styled.div`
   position: relative;
 
   &.narrow {
-    position: fixed;
-    top: 0;
-    left: 0;
     width: 100%;
-    z-index: 2;
   }
 `;
 
diff --git a/packages/react-chat/src/components/NarrowMode/NarrowChannels.tsx b/packages/react-chat/src/components/NarrowMode/NarrowChannels.tsx
index c7e5ac01..2d8f89e9 100644
--- a/packages/react-chat/src/components/NarrowMode/NarrowChannels.tsx
+++ b/packages/react-chat/src/components/NarrowMode/NarrowChannels.tsx
@@ -48,6 +48,6 @@ export function NarrowChannels({
 }
 
 const ListWrapper = styled.div`
-  padding: 82px 18px 18px;
+  padding: 0px 18px 18px;
   background: ${({ theme }) => theme.bodyBackgroundColor};
 `;
diff --git a/packages/react-chat/src/components/NarrowMode/NarrowMembers.tsx b/packages/react-chat/src/components/NarrowMode/NarrowMembers.tsx
index fb847d44..eb14dc76 100644
--- a/packages/react-chat/src/components/NarrowMode/NarrowMembers.tsx
+++ b/packages/react-chat/src/components/NarrowMode/NarrowMembers.tsx
@@ -30,6 +30,6 @@ export function NarrowMembers({
 }
 
 const ListWrapper = styled.div`
-  padding: 82px 18px 18px;
+  padding: 0px 18px 18px;
   background: ${({ theme }) => theme.bodyBackgroundColor};
 `;
diff --git a/packages/react-chat/src/components/NarrowMode/NarrowTopbar.tsx b/packages/react-chat/src/components/NarrowMode/NarrowTopbar.tsx
index 367dbb8d..0924463e 100644
--- a/packages/react-chat/src/components/NarrowMode/NarrowTopbar.tsx
+++ b/packages/react-chat/src/components/NarrowMode/NarrowTopbar.tsx
@@ -22,7 +22,6 @@ const TopbarWrapper = styled.div`
   text-align: center;
   background-color: ${({ theme }) => theme.bodyBackgroundColor};
   padding: 14px 0;
-  position: relative;
 `;
 
 const Heading = styled.p`