diff --git a/ts/components/dialog/UpdateGroupMembersDialog.tsx b/ts/components/dialog/UpdateGroupMembersDialog.tsx index e6ed6929a..56985d50d 100644 --- a/ts/components/dialog/UpdateGroupMembersDialog.tsx +++ b/ts/components/dialog/UpdateGroupMembersDialog.tsx @@ -15,11 +15,16 @@ import useKey from 'react-use/lib/useKey'; import { useSet } from '../../hooks/useSet'; import { getConversationController } from '../../session/conversations'; import { initiateClosedGroupUpdate } from '../../session/group/closed-group'; +import styled from 'styled-components'; type Props = { conversationId: string; }; +const StyledClassicMemberList = styled.div` + max-height: 240px; +`; + /** * Admins are always put first in the list of group members. * Also, admins have a little crown on their avatar. @@ -54,6 +59,7 @@ const ClassicMemberList = (props: { onUnselect={onUnselect} key={member} isAdmin={isAdmin} + disableBg={true} /> ); })} @@ -229,14 +235,14 @@ export const UpdateGroupMembersDialog = (props: Props) => { return ( -
+ -
+ {showNoMembersMessage &&

{window.i18n('noMembersInThisGroup')}

} diff --git a/ts/components/leftpane/overlay/OverlayClosedGroup.tsx b/ts/components/leftpane/overlay/OverlayClosedGroup.tsx index 282aad424..61492b53d 100644 --- a/ts/components/leftpane/overlay/OverlayClosedGroup.tsx +++ b/ts/components/leftpane/overlay/OverlayClosedGroup.tsx @@ -34,6 +34,16 @@ const StyledGroupMemberListContainer = styled.div` overflow-y: auto; border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); + + &::-webkit-scrollbar-track { + background-color: var(--background-secondary-color); + } +`; + +const StyledGroupMemberList = styled.div` + button { + background-color: var(--background-secondary-color); + } `; const NoContacts = () => { @@ -119,7 +129,7 @@ export const OverlayClosedGroup = () => { {noContactsForClosedGroup ? ( ) : ( -
+ {contactsToRender.map((memberPubkey: string) => ( { key={memberPubkey} onSelect={addToSelected} onUnselect={removeFromSelected} + disableBg={true} /> ))} -
+ )}