status-im
/
dappconnect-sdks
mirror of https://github.com/status-im/dappconnect-sdks.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Add offline indicator (#66)

This commit is contained in:
Maria Rushkova 2021-10-12 12:06:59 +02:00 committed by GitHub
parent f7916f283f
commit 2a38552281
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 16 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/react-chat/src/components/Members.tsx
View File

@ -105,7 +105,7 @@ export function Member({
style={{
backgroundImage: member.avatar ? `url(${member.avatar})` : "unset",
}}
className={isOnline ? "online" : ""}
className={isOnline ? "online" : "offline"}
>
{!member.avatar && <UserIcon memberView={true} />}
</MemberIcon>
@ -182,12 +182,26 @@ const MemberIcon = styled(Icon)`
background-position: center;
flex-shrink: 0;
&.offline {
&::after {
content: "";
position: absolute;
right: -1px;
bottom: -2px;
width: 7px;
height: 7px;
border-radius: 50%;
background-color: ${({ theme }) => theme.secondary};
border: 2px solid ${({ theme }) => theme.bodyBackgroundColor};
}
}
&.online {
&::after {
content: "";
position: absolute;
right: -1px;
bottom: 1px;
bottom: -2px;
width: 7px;
height: 7px;
border-radius: 50%;