diff --git a/src/video-grid/VideoTile.module.css b/src/video-grid/VideoTile.module.css index 5ec3aae..f003ed9 100644 --- a/src/video-grid/VideoTile.module.css +++ b/src/video-grid/VideoTile.module.css @@ -89,6 +89,12 @@ limitations under the License. z-index: 1; } +.infoBubble > svg { + height: 16px; + width: 16px; + margin-right: 4px; +} + .toolbar { position: absolute; top: 0; @@ -132,10 +138,6 @@ limitations under the License. bottom: 16px; } -.memberName > * { - margin-right: 6px; -} - .memberName > :last-child { margin-right: 0px; } diff --git a/src/video-grid/VideoTile.tsx b/src/video-grid/VideoTile.tsx index e3d26ad..005e10c 100644 --- a/src/video-grid/VideoTile.tsx +++ b/src/video-grid/VideoTile.tsx @@ -20,8 +20,8 @@ import classNames from "classnames"; import { useTranslation } from "react-i18next"; import styles from "./VideoTile.module.css"; +import { ReactComponent as MicIcon } from "../icons/Mic.svg"; import { ReactComponent as MicMutedIcon } from "../icons/MicMuted.svg"; -import { ReactComponent as VideoMutedIcon } from "../icons/VideoMuted.svg"; import { AudioButton, FullscreenButton } from "../button/Button"; import { ConnectionState } from "../room/useGroupCall"; @@ -178,9 +178,8 @@ export const VideoTile = forwardRef( Mute state is currently sent over to-device messages, which aren't quite real-time, so this is an important kludge to make sure no one appears muted when they've clearly begun talking. */ - audioMuted && !videoMuted && !speaking && + speaking || !audioMuted ? : } - {videoMuted && } {caption}