chris/frigate
1
0
Fork 0
forked from Github/frigate
Code Pull Requests Packages Activity

UI cleanup (#10567)

Browse Source 
* Fix selected items text

* Use action icons from design and fix spacing

* Fix icons for live grid

* Fix viewed select api

* Setup default theme as system

* Make conig editor respect system theme
This commit is contained in:
Nicolas Mowen
2024-03-20 19:46:45 -06:00
committed by GitHub
parent 5af083cd8a
commit 8babe57d63
6 changed files with 90 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
web/src/views/live/LiveDashboardView.tsx
View File

@@ -1,6 +1,7 @@
import { useFrigateReviews } from "@/api/ws";
import Logo from "@/components/Logo";
import { CameraGroupSelector } from "@/components/filter/CameraGroupSelector";
import { LiveGridIcon, LiveListIcon } from "@/components/icons/LiveIcons";
import { AnimatedEventThumbnail } from "@/components/image/AnimatedEventThumbnail";
import BirdseyeLivePlayer from "@/components/player/BirdseyeLivePlayer";
import LivePlayer from "@/components/player/LivePlayer";
@@ -12,7 +13,6 @@ import { CameraConfig, FrigateConfig } from "@/types/frigateConfig";
import { ReviewSegment } from "@/types/review";
import { useCallback, useEffect, useMemo, useState } from "react";
import { isDesktop, isMobile, isSafari } from "react-device-detect";
import { CiGrid2H, CiGrid31 } from "react-icons/ci";
import useSWR from "swr";
type LiveDashboardViewProps = {
@@ -89,26 +89,26 @@ export default function LiveDashboardView({
<CameraGroupSelector />
<div className="flex items-center gap-1">
<Button
className={
className={`p-1 ${
layout == "grid"
? "text-selected bg-blue-900 focus:bg-blue-900 bg-opacity-60 focus:bg-opacity-60"
: "text-muted-foreground bg-muted"
}
? "bg-blue-900 focus:bg-blue-900 bg-opacity-60 focus:bg-opacity-60"
: "bg-muted"
}`}
size="xs"
onClick={() => setLayout("grid")}
>
<CiGrid31 className="m-1" />
<LiveGridIcon layout={layout} />
</Button>
<Button
className={
className={`p-1 ${
layout == "list"
? "text-selected bg-blue-900 focus:bg-blue-900 bg-opacity-60 focus:bg-opacity-60"
: "text-muted-foreground bg-muted"
}
? "bg-blue-900 focus:bg-blue-900 bg-opacity-60 focus:bg-opacity-60"
: "bg-muted"
}`}
size="xs"
onClick={() => setLayout("list")}
>
<CiGrid2H className="m-1" />
<LiveListIcon layout={layout} />
</Button>
</div>
</div>