diff --git a/src/room/VideoPreview.module.css b/src/room/VideoPreview.module.css index e7aabf79..8b34b8a1 100644 --- a/src/room/VideoPreview.module.css +++ b/src/room/VideoPreview.module.css @@ -19,10 +19,13 @@ Please see LICENSE in the repository root for full details. height: 100%; object-fit: cover; background-color: black; - transform: scaleX(-1); background-color: var(--cpd-color-bg-subtle-primary); } +video.mirror { + transform: scaleX(-1); +} + .avatarContainer { position: absolute; top: 0; diff --git a/src/room/VideoPreview.tsx b/src/room/VideoPreview.tsx index 80aa1069..af05369e 100644 --- a/src/room/VideoPreview.tsx +++ b/src/room/VideoPreview.tsx @@ -7,7 +7,7 @@ Please see LICENSE in the repository root for full details. import { useEffect, useRef, FC, ReactNode } from "react"; import useMeasure from "react-use-measure"; -import { LocalVideoTrack } from "livekit-client"; +import { facingModeFromLocalTrack, LocalVideoTrack } from "livekit-client"; import classNames from "classnames"; import { Avatar } from "../Avatar"; @@ -56,6 +56,12 @@ export const VideoPreview: FC = ({ return (