administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-10 21:25:24 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Improve recording landscape view

Browse Source
This commit is contained in:
Nicolas Mowen 2024-04-06 19:30:28 -06:00
parent e6893145a6
commit ad4fad7d8c
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/views/events/RecordingView.tsx
View File

@ -341,7 +341,7 @@ export function RecordingView({
</div> </div>
<div <div
className={`h-full flex justify-center overflow-hidden ${isDesktop ? "" : "flex-col gap-2"}`} className={`h-full flex justify-center overflow-hidden ${isDesktop ? "" : "flex-col landscape:flex-row gap-2"}`}
> >
<div className={`${isDesktop ? "w-[80%]" : ""} flex flex-1 flex-wrap`}> <div className={`${isDesktop ? "w-[80%]" : ""} flex flex-1 flex-wrap`}>
<div <div
@ -352,7 +352,7 @@ export function RecordingView({
className={ className={
isDesktop isDesktop
? `${mainCameraAspect == "tall" ? "h-[90%]" : mainCameraAspect == "wide" ? "w-full" : "w-[78%]"} px-4 flex justify-center` ? `${mainCameraAspect == "tall" ? "h-[90%]" : mainCameraAspect == "wide" ? "w-full" : "w-[78%]"} px-4 flex justify-center`
: `w-full pt-2 ${mainCameraAspect == "wide" ? "aspect-wide" : "aspect-video"}` : `portrait:w-full pt-2 ${mainCameraAspect == "wide" ? "landscape:w-full aspect-wide" : "landscape:h-full aspect-video"}`
} }
style={{ style={{
aspectRatio: isDesktop aspectRatio: isDesktop
@ -497,7 +497,7 @@ function Timeline({
className={`${ className={`${
isDesktop isDesktop
? `${timelineType == "timeline" ? "w-[100px]" : "w-60"} overflow-y-auto no-scrollbar` ? `${timelineType == "timeline" ? "w-[100px]" : "w-60"} overflow-y-auto no-scrollbar`
: "flex-grow overflow-hidden" : "portrait:flex-grow landscape:w-[20%] overflow-hidden"
} relative`} } relative`}
> >
<div className="absolute top-0 inset-x-0 z-20 w-full h-[30px] bg-gradient-to-b from-secondary to-transparent pointer-events-none"></div> <div className="absolute top-0 inset-x-0 z-20 w-full h-[30px] bg-gradient-to-b from-secondary to-transparent pointer-events-none"></div>