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

fix tooltips on mobile and make 2-row cameras full height

Browse Source
This commit is contained in:
Josh Hawkins 2024-02-10 16:33:32 -06:00
parent 44d8cdbba1
commit eb5c903936
2 changed files with 6 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
web/src/components/Sidebar.tsx
View File

@ -20,6 +20,7 @@ function Sidebar({
}) { }) {
const sidebar = ( const sidebar = (
<aside className="w-[52px] z-10 h-screen sticky top-0 overflow-y-auto scrollbar-hidden py-4 flex flex-col justify-between"> <aside className="w-[52px] z-10 h-screen sticky top-0 overflow-y-auto scrollbar-hidden py-4 flex flex-col justify-between">
<span tabIndex={0} className="sr-only" />
<div className="w-full flex flex-col gap-0 items-center"> <div className="w-full flex flex-col gap-0 items-center">
<Logo className="w-8 h-8 mb-6" /> <Logo className="w-8 h-8 mb-6" />
{navbarLinks.map((item) => ( {navbarLinks.map((item) => (

9
web/src/pages/Live.tsx
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] md:h-full`;
} else { } else {
grow = "aspect-video"; grow = "aspect-video";
} }