Add border to the Avatars (#2428)

This commit is contained in:
Lipis 2020-11-29 20:19:06 +02:00 committed by GitHub
parent b21fd49412
commit bdb1fb2dae
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 3 deletions

View File

@ -43,12 +43,13 @@ export const actionGoToCollaborator = register({
return null;
}
const { background } = getClientColors(clientId);
const { background, stroke } = getClientColors(clientId);
const shortName = getClientInitials(collaborator.username);
return (
<Avatar
color={background}
border={stroke}
onClick={() => updateData(collaborator.pointer)}
>
{shortName}

View File

@ -6,10 +6,15 @@ type AvatarProps = {
children: string;
onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
color: string;
border: string;
};
export const Avatar = ({ children, color, onClick }: AvatarProps) => (
<div className="Avatar" style={{ background: color }} onClick={onClick}>
export const Avatar = ({ children, color, border, onClick }: AvatarProps) => (
<div
className="Avatar"
style={{ background: color, border: `1px solid ${border}` }}
onClick={onClick}
>
{children}
</div>
);