fix(moderation) hide status icons on hover (#9747)

This commit is contained in:
Avram Tudor 2021-08-19 11:32:36 +03:00 committed by GitHub
parent 4788720edd
commit d41c597446
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 15 deletions

View File

@ -114,6 +114,7 @@ export default function ParticipantItem({
<ParticipantContainer
id = { `participant-item-${participantID}` }
isHighlighted = { isHighlighted }
local = { local }
onMouseLeave = { onLeave }
trigger = { actionsTrigger }>
<Avatar

View File

@ -246,6 +246,21 @@ export const ParticipantContent = styled.div`
padding-right: ${props => props.theme.panePadding}px;
`;
export const ParticipantStates = styled.div`
display: flex;
justify-content: flex-end;
& > * {
align-items: center;
display: flex;
justify-content: center;
}
& > *:not(:last-child) {
margin-right: 8px;
}
`;
export const ParticipantContainer = styled.div`
align-items: center;
color: white;
@ -256,6 +271,12 @@ export const ParticipantContainer = styled.div`
padding-left: ${props => props.theme.panePadding}px;
position: relative;
&:hover {
${ParticipantStates} {
${props => !props.local && 'display: none'};
}
}
${props => !props.isHighlighted && '&:hover {'}
background-color: #292929;
@ -296,21 +317,6 @@ export const ParticipantNameContainer = styled.div`
overflow: hidden;
`;
export const ParticipantStates = styled.div`
display: flex;
justify-content: flex-end;
& > * {
align-items: center;
display: flex;
justify-content: center;
}
& > *:not(:last-child) {
margin-right: 8px;
}
`;
export const RaisedHandIndicatorBackground = styled.div`
background-color: #ed9e1b;
border-radius: 3px;