xmj/element-call
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Subtly animate active speaker indicators

Browse source 
A light touch of animation here is consistent with what the designs call for, and what we've done with the toolbars on video tiles.
This commit is contained in:
Robin Townsend 2023-05-12 14:49:55 -04:00
commit caf90d851e
1 changed files with 7 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/video-grid/VideoTile.module.css
View file

@ -45,7 +45,7 @@ limitations under the License.
transform: scaleX(-1); transform: scaleX(-1);
} }
.videoTile.speaking::after { .videoTile::after {
position: absolute; position: absolute;
top: -1px; top: -1px;
left: -1px; left: -1px;
@ -54,6 +54,12 @@ limitations under the License.
content: ""; content: "";
border-radius: var(--tileRadius); border-radius: var(--tileRadius);
box-shadow: inset 0 0 0 4px var(--accent) !important; box-shadow: inset 0 0 0 4px var(--accent) !important;
opacity: 0;
transition: opacity ease 0.15s;
}
.videoTile.speaking::after {
opacity: 1;
} }
.videoTile.maximised { .videoTile.maximised {