improve avatar spacing

This commit is contained in:
Sebastian Sdorra
2020-06-09 16:38:20 +02:00
parent 27db6c5b4a
commit 24c39faedd

View File

@@ -46,10 +46,15 @@ const useAvatar = (person: Person): string | undefined => {
} }
}; };
const AvatarList = styled.span`
& > :not(:last-child) {
margin-right: 0.25em;
}
`;
const AvatarImage = styled(Image)` const AvatarImage = styled(Image)`
width: 1em; width: 1em;
height: 1em; height: 1em;
margin-right: 0.25em;
vertical-align: middle !important; vertical-align: middle !important;
margin-bottom: 0.2em; margin-bottom: 0.2em;
border-radius: 0.25em; border-radius: 0.25em;
@@ -112,9 +117,11 @@ const Persons: FC<PersonsProps> = ({ persons, label, displayTextOnly }) => {
return ( return (
<> <>
{t(label)}{" "} {t(label)}{" "}
{persons.map(p => ( <AvatarList>
<PersonAvatar person={p} avatar={avatarFactory(p)} /> {persons.map(p => (
))} <PersonAvatar person={p} avatar={avatarFactory(p)} />
))}
</AvatarList>
</> </>
); );
} else { } else {
@@ -148,11 +155,7 @@ const ChangesetAuthor: FC<Props> = ({ changeset }) => {
const authorLine = []; const authorLine = [];
if (changeset.author) { if (changeset.author) {
authorLine.push( authorLine.push(
<Persons <Persons persons={[changeset.author]} label={"changesets.authors.authoredBy"} displayTextOnly={true} />
persons={[changeset.author]}
label={"changesets.authors.authoredBy"}
displayTextOnly={true}
/>
); );
} }