Set aspect ratios on live display (#9780)

* set aspect ratios on live display

* try 8/9
This commit is contained in:
Josh Hawkins 2024-02-10 10:28:23 -06:00 committed by GitHub
parent 44d8cdbba1
commit 2d22800a3d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 7 additions and 6 deletions

View File

@ -74,8 +74,8 @@ function SidebarItem({ Icon, title, url, dev, onClick }: SidebarItemProps) {
className={({ isActive }) => className={({ isActive }) =>
`mx-[10px] mb-6 flex flex-col justify-center items-center rounded-lg ${ `mx-[10px] mb-6 flex flex-col justify-center items-center rounded-lg ${
isActive isActive
? "font-bold text-white bg-primary" ? "font-bold text-primary-foreground bg-primary"
: "text-muted-foreground bg-secondary" : "text-muted-foreground bg-muted"
}` }`
} }
> >

View File

@ -78,10 +78,11 @@ function Live() {
<div className="mt-4 md:grid md:grid-cols-2 xl:grid-cols-3 3xl:grid-cols-4 gap-4"> <div className="mt-4 md:grid md:grid-cols-2 xl:grid-cols-3 3xl:grid-cols-4 gap-4">
{cameras.map((camera) => { {cameras.map((camera) => {
let grow; let grow;
if (camera.detect.width / camera.detect.height > 2) { let aspectRatio = camera.detect.width / camera.detect.height;
grow = "aspect-wide md:col-span-2"; if (aspectRatio > 2) {
} else if (camera.detect.width / camera.detect.height < 1) { grow = "md:col-span-2 aspect-wide";
grow = "aspect-tall md:aspect-auto md:row-span-2"; } else if (aspectRatio < 1) {
grow = `md:row-span-2 aspect-[8/9]`;
} else { } else {
grow = "aspect-video"; grow = "aspect-video";
} }