From 17bfc35e9ec6c4197a645205d3ef1adf86c0c5a7 Mon Sep 17 00:00:00 2001
From: Pritipriya Singh <mail2pritipriya@gmail.com>
Date: Tue, 27 Feb 2024 02:46:14 +0530
Subject: [PATCH] z-index issues

---
 src/App.tsx                                         | 2 +-
 src/components/chat/w2wChat/searchBar/SearchBar.tsx | 2 ++
 src/sections/chat/ChatSidebarSection.tsx            | 6 +++++-
 src/structure/Navigation.tsx                        | 2 +-
 4 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 1c4c4a089c..4d92919128 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -347,7 +347,7 @@ const HeaderContainer = styled.header`
   width: 100%;
   position: fixed;
   top: 0;
-  z-index: 99999;
+  z-index: 999;
 `;
 
 const ParentContainer = styled.div`
diff --git a/src/components/chat/w2wChat/searchBar/SearchBar.tsx b/src/components/chat/w2wChat/searchBar/SearchBar.tsx
index 9adf5ec57a..ce82a177b0 100644
--- a/src/components/chat/w2wChat/searchBar/SearchBar.tsx
+++ b/src/components/chat/w2wChat/searchBar/SearchBar.tsx
@@ -173,6 +173,7 @@ const SearchBar = ({ autofilled, searchedUser, setSearchedUser }) => {
             height="48px"
             top="10px"
             right="0px"
+            zIndex="1"
           >
             <ButtonV2
               alignSelf="stretch"
@@ -181,6 +182,7 @@ const SearchBar = ({ autofilled, searchedUser, setSearchedUser }) => {
               borderRadius="50%"
               onClick={() => setActiveTab(3)}
             >
+           
               <AddIcon style={{ color: '#FFFFFF', fontSize: '24px', cursor: 'pointer' }} />
             </ButtonV2>
           </ItemVV2>
diff --git a/src/sections/chat/ChatSidebarSection.tsx b/src/sections/chat/ChatSidebarSection.tsx
index 7d0ba3863d..ef8095725d 100644
--- a/src/sections/chat/ChatSidebarSection.tsx
+++ b/src/sections/chat/ChatSidebarSection.tsx
@@ -149,6 +149,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => {
               hoverBackground="transparent"
               color={theme.default.color}
               flex="1"
+              zIndex="1"
               padding="10px 10px 20px 10px"
               onClick={() => {
                 setActiveTab(0);
@@ -168,6 +169,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => {
               background="transparent"
               hoverBackground="transparent"
               color={theme.default.color}
+              zIndex="1"
               flex="1"
               padding="10px 10px 20px 10px"
               onClick={() => {
@@ -228,6 +230,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => {
             autofilled={undefined}
             searchedUser={searchedUser}
             setSearchedUser={setSearchedUser}
+            
           />
         )}
         {activeTab == 0 && (
@@ -235,6 +238,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => {
             // justifyContent="flex-start"
             flex="none"
             padding="20px 10px 24px 10px"
+            zIndex="1"
             borderRadius={GLOBALS.ADJUSTMENTS.RADIUS.MID}
             onClick={handleCreateGroup}
             background="transparent"
@@ -351,7 +355,7 @@ const ChatSidebarSection = ({ showCreateGroupModal, autofilledSearch }) => {
         </QRCodeContainer>
       ) : null}
 
-      <ProfileContainer zIndex='10' borderTop={`1px solid ${theme.default.secondaryBg}`}>
+      <ProfileContainer zIndex='1' borderTop={`1px solid ${theme.default.secondaryBg}`}>
         {/* <ProfileHeader
           setActiveTab={setActiveTab}
           setShowQR={setShowQR}
diff --git a/src/structure/Navigation.tsx b/src/structure/Navigation.tsx
index a6ad7b2da2..ab88f0a197 100644
--- a/src/structure/Navigation.tsx
+++ b/src/structure/Navigation.tsx
@@ -431,7 +431,7 @@ function Navigation() {
                 }}
                 placementProps={{
                   width: 'fit-content',
-                  zIndex: '100',
+                  zIndex: '1',
                   position: 'fixed',
                   bottom: sidebarCollapsed ? '7px' : '1rem',
                   left: sidebarCollapsed ? '6rem' : '16rem',