simplify and fix layout system for timeline

This commit is contained in:
Nicolas Mowen 2024-01-30 10:08:23 -07:00
parent 54b0462f07
commit 8f3457aa66
2 changed files with 89 additions and 87 deletions

View File

@ -268,7 +268,7 @@ function TimelineViewer({
return (
<Dialog open={playback != undefined} onOpenChange={(_) => onClose()}>
<DialogContent className="w-[70%] max-w-[1920px]">
<DialogContent className="w-[70%] max-w-[1920px] h-[90%]">
{timelineData && playback && (
<DesktopTimelineView
timelineData={timelineData}

View File

@ -108,8 +108,8 @@ export default function DesktopTimelineView({
}
return (
<div className="w-full xl:h-[586px] 2xl:h-[660px] 3xl:h-[880px] 4xl:h-[1080px]">
<div className="flex h-[60%]">
<div className="w-full flex flex-col">
<div className="flex max-h-[60%]">
<DynamicVideoPlayer
className="w-2/3 bg-black flex justify-center items-center"
camera={initialPlayback.camera}
@ -144,7 +144,8 @@ export default function DesktopTimelineView({
})}
</div>
</div>
<div className="mt-4 w-full h-[40%] overflow-scroll">
<div className="mt-4 w-full h-full relative">
<div className="absolute left-0 top-0 right-0 bottom-0 overflow-auto">
{timelineStack.playbackItems.map((timeline) => {
const isInitiallySelected =
initialPlayback.range.start == timeline.range.start;
@ -235,5 +236,6 @@ export default function DesktopTimelineView({
})}
</div>
</div>
</div>
);
}