fix: tooltip was not properly aligned

Tooltip was not properly aigned in the group Info in UIWeb #1299
push-protocol · May 29, 2024 · bbf6778 · bbf6778
1 parent c52e517
commit bbf6778
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 9 deletions.
diff --git a/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfileInfoModal.tsx b/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfileInfoModal.tsx
@@ -423,7 +423,6 @@ const GroupInformation = ({
         <Section
           borderRadius="16px"
           flexDirection="column"
-          gap="16px"
         >
           {groupMembers.loading ? (
             <Spinner
@@ -1014,7 +1013,7 @@ const GroupDescription = styled.div`
   gap: 5px;
 `;
 
-const PublicEncrypted = styled(Section)<{ alert?: boolean }>`
+const PublicEncrypted = styled(Section) <{ alert?: boolean }>`
   display: flex;
   flex-direction: row;
   width: 100%;
@@ -1040,7 +1039,7 @@ const AddWalletContainer = styled.div`
   align-items: center;
 `;
 
-const ConditionSection = styled(Section)<{ theme: IChatTheme }>`
+const ConditionSection = styled(Section) <{ theme: IChatTheme }>`
   &::-webkit-scrollbar-thumb {
     background: ${(props) => props.theme.scrollbarColor};
     border-radius: 10px;
@@ -1053,7 +1052,7 @@ const ConditionSection = styled(Section)<{ theme: IChatTheme }>`
   }
 `;
 
-const ScrollSection = styled(Section)<{ theme: IChatTheme }>`
+const ScrollSection = styled(Section) <{ theme: IChatTheme }>`
   &::-webkit-scrollbar-thumb {
     background: ${(props) => props.theme.scrollbarColor};
     border-radius: 10px;

diff --git a/packages/uiweb/src/lib/components/chat/ChatProfile/PendingMembers.tsx b/packages/uiweb/src/lib/components/chat/ChatProfile/PendingMembers.tsx
@@ -110,6 +110,7 @@ export const PendingMembers = ({
           justifyContent="start"
           borderRadius="12px"
           theme={theme}
+          padding='10px 0 0 0'
         >
           {showPendingRequests &&
             pendingMembers &&
@@ -304,6 +305,7 @@ export const AcceptedMembers = ({
         overflow="hidden auto"
         maxHeight="15rem"
         theme={theme}
+        padding='10px 0 0 0'
       >
         {acceptedMembers.map((item, index) => (
           <MemberProfileCard
@@ -313,8 +315,8 @@ export const AcceptedMembers = ({
               isAdmin(item) && accountStatus?.role === GROUP_ROLES.ADMIN.toLowerCase()
                 ? [removeAdminDropdown, removeMemberDropdown]
                 : accountStatus?.role === GROUP_ROLES.ADMIN.toLowerCase()
-                ? [addAdminDropdown, removeMemberDropdown]
-                : []
+                  ? [addAdminDropdown, removeMemberDropdown]
+                  : []
             }
             selectedMemberAddress={selectedMemberAddress}
             setSelectedMemberAddress={setSelectedMemberAddress}
@@ -371,11 +373,11 @@ const PendingSection = styled.div`
   align-items: center;
   flex: 1;
   cursor: pointer;
-  padding: 15px 20px;
+  padding: 15px 20px 5px 20px;
   box-sizing: border-box;
 `;
 
-const ArrowImage = styled(Image)<ShadowedProps>`
+const ArrowImage = styled(Image) <ShadowedProps>`
   margin-left: auto;
   transform: ${(props) => (props?.setPosition ? 'rotate(0)' : 'rotate(180deg)')};
 `;
@@ -390,7 +392,7 @@ const Badge = styled.div`
   font-weight: 700;
 `;
 
-const ProfileSection = styled(Section)<{ theme: IChatTheme }>`
+const ProfileSection = styled(Section) <{ theme: IChatTheme }>`
   height: fit-content;
   &::-webkit-scrollbar-thumb {
     background: transparent;