Adjust layout

This commit is contained in:
Nicolas Mowen 2024-03-11 16:28:23 -06:00
parent eb6d7e9fb3
commit f0376365b2

View File

@ -191,10 +191,10 @@ export function DesktopRecordingView({
<div className="flex h-full justify-center overflow-hidden"> <div className="flex h-full justify-center overflow-hidden">
<div className="flex flex-1 flex-wrap"> <div className="flex flex-1 flex-wrap">
<div className="flex flex-col h-full px-2 justify-end"> <div className="w-full flex flex-col h-full px-2 justify-center">
<div key={mainCamera} className="flex justify-center mb-5"> <div key={mainCamera} className="flex justify-center items mb-5">
<DynamicVideoPlayer <DynamicVideoPlayer
className={`w-[85%] ${grow}`} className={`w-[82%] ${grow}`}
camera={mainCamera} camera={mainCamera}
timeRange={currentTimeRange} timeRange={currentTimeRange}
cameraPreviews={allPreviews ?? []} cameraPreviews={allPreviews ?? []}
@ -203,25 +203,17 @@ export function DesktopRecordingView({
videoPlayersRef.current[mainCamera] = controller; videoPlayersRef.current[mainCamera] = controller;
controller.onPlayerTimeUpdate((timestamp: number) => { controller.onPlayerTimeUpdate((timestamp: number) => {
setCurrentTime(timestamp); setCurrentTime(timestamp);
allCameras.forEach((otherCam) => {
if (mainCamera != otherCam) {
videoPlayersRef.current[otherCam]?.scrubToTimestamp(
Math.floor(timestamp),
);
}
});
}); });
}} }}
/> />
</div> </div>
<div className="flex justify-end gap-2 overflow-x-auto"> <div className="w-full flex justify-center gap-2 overflow-x-auto">
{allCameras.map((cam) => { {allCameras.map((cam) => {
if (cam !== mainCamera) { if (cam !== mainCamera) {
return ( return (
<div <div
key={cam} key={cam}
className="aspect-video flex items-center we-[300px]" className="aspect-video flex items-center w-[260px]"
> >
<DynamicVideoPlayer <DynamicVideoPlayer
className="size-full" className="size-full"