💫(frontend) wave icon when a participant raises her hand
Minor enhancement, add some CSS animation to wave a newly raised hand. Inspired by GMeet.
This commit is contained in:
committed by
aleb_the_flash
parent
26ca81db40
commit
53d732d802
@@ -75,6 +75,12 @@ const config: Config = {
|
|||||||
'50%': { height: '4px' },
|
'50%': { height: '4px' },
|
||||||
'100%': { height: '8px' },
|
'100%': { height: '8px' },
|
||||||
},
|
},
|
||||||
|
wave_hand: {
|
||||||
|
'0%': { transform: 'rotate(0deg)' },
|
||||||
|
'20%': { transform: 'rotate(-20deg)' },
|
||||||
|
'80%': { transform: 'rotate(20deg)' },
|
||||||
|
'100%': { transform: 'rotate(0)' },
|
||||||
|
},
|
||||||
},
|
},
|
||||||
tokens: defineTokens({
|
tokens: defineTokens({
|
||||||
/* we take a few things from the panda preset but for now we clear out some stuff.
|
/* we take a few things from the panda preset but for now we clear out some stuff.
|
||||||
|
|||||||
@@ -133,6 +133,9 @@ export const ParticipantTile: (
|
|||||||
size={16}
|
size={16}
|
||||||
style={{
|
style={{
|
||||||
marginInlineEnd: '.25rem', // fixme - match TrackMutedIndicator styling
|
marginInlineEnd: '.25rem', // fixme - match TrackMutedIndicator styling
|
||||||
|
animationDuration: '300ms',
|
||||||
|
animationName: 'wave_hand',
|
||||||
|
animationIterationCount: '2',
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user