🚸(frontend) highlight raised hands in participant's tile
Users's feedbacks. Raised hands in participants' tiles were not highlighted enough. It was discussed adding a colorful border around the participant's tile (idea inspired by Jitsi). Nonetheless, it conflicts with the current blue border, indicating when a participant is speaking. Until this blue border is present, it's not a great idea having a second border indicating a new level of informations. @sampacoud requested a yellow-ish/colorful indicator of when a participant raised her hand, inspired by Jitsi. However, I think yellow color should be reserved for warning or dangerous action. I chose to use a white background around the participant's name, to reinforce the visual indication a participant has her hand raised, while still being discreet. It's inspired by Gmeet.
This commit is contained in:
committed by
aleb_the_flash
parent
c5ce32ef79
commit
4e175a8361
@@ -123,13 +123,16 @@ export const ParticipantTile: (
|
|||||||
className="lk-participant-metadata-item"
|
className="lk-participant-metadata-item"
|
||||||
style={{
|
style={{
|
||||||
minHeight: '24px',
|
minHeight: '24px',
|
||||||
|
backgroundColor: isHandRaised ? 'white' : undefined,
|
||||||
|
color: isHandRaised ? 'black' : undefined,
|
||||||
|
transition: 'background 200ms ease, color 400ms ease',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{trackReference.source === Track.Source.Camera ? (
|
{trackReference.source === Track.Source.Camera ? (
|
||||||
<>
|
<>
|
||||||
{isHandRaised && (
|
{isHandRaised && (
|
||||||
<RiHand
|
<RiHand
|
||||||
color="white"
|
color="black"
|
||||||
size={16}
|
size={16}
|
||||||
style={{
|
style={{
|
||||||
marginInlineEnd: '.25rem', // fixme - match TrackMutedIndicator styling
|
marginInlineEnd: '.25rem', // fixme - match TrackMutedIndicator styling
|
||||||
|
|||||||
Reference in New Issue
Block a user