administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2025-12-06 21:44:13 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

small tweaks

Browse Source
This commit is contained in:
Josh Hawkins 2025-11-08 06:09:16 -06:00
parent 07a378a837
commit c9016feae3
2 changed files with 18 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
web/src/components/overlay/detail/SearchDetailDialog.tsx
View File

@ -72,7 +72,12 @@ import {
PopoverContent, PopoverContent,
PopoverTrigger, PopoverTrigger,
} from "@/components/ui/popover"; } from "@/components/ui/popover";
import { Drawer, DrawerContent, DrawerTrigger } from "@/components/ui/drawer"; import {
Drawer,
DrawerContent,
DrawerTitle,
DrawerTrigger,
} from "@/components/ui/drawer";
import { LuInfo } from "react-icons/lu"; import { LuInfo } from "react-icons/lu";
import { TooltipPortal } from "@radix-ui/react-tooltip"; import { TooltipPortal } from "@radix-ui/react-tooltip";
import { FaPencilAlt } from "react-icons/fa"; import { FaPencilAlt } from "react-icons/fa";
@ -126,7 +131,7 @@ function TabsWithActions({
return ( return (
<div className="flex items-center justify-between gap-1"> <div className="flex items-center justify-between gap-1">
<ScrollArea className="flex-1 whitespace-nowrap"> <ScrollArea className="flex-1 whitespace-nowrap">
<div className="mb-2 flex flex-row md:mb-0"> <div className="mb-2 flex flex-row">
<ToggleGroup <ToggleGroup
className="*:rounded-md *:px-3 *:py-4" className="*:rounded-md *:px-3 *:py-4"
type="single" type="single"
@ -224,6 +229,7 @@ function AnnotationSettings({
const Overlay = isDesktop ? Popover : Drawer; const Overlay = isDesktop ? Popover : Drawer;
const Trigger = isDesktop ? PopoverTrigger : DrawerTrigger; const Trigger = isDesktop ? PopoverTrigger : DrawerTrigger;
const Content = isDesktop ? PopoverContent : DrawerContent; const Content = isDesktop ? PopoverContent : DrawerContent;
const Title = isDesktop ? "div" : DrawerTitle;
const contentProps = isDesktop const contentProps = isDesktop
? { align: "end" as const, container: container ?? undefined } ? { align: "end" as const, container: container ?? undefined }
: {}; : {};
@ -248,7 +254,9 @@ function AnnotationSettings({
<PiSlidersHorizontalBold className="size-5" /> <PiSlidersHorizontalBold className="size-5" />
</Button> </Button>
</Trigger> </Trigger>
<Title className="sr-only">
{t("trackingDetails.adjustAnnotationSettings")}
</Title>
<Content <Content
className={ className={
isDesktop isDesktop
@ -340,7 +348,7 @@ function DialogContentComponent({
} }
/> />
) : ( ) : (
<div className={cn(!isDesktop ? "mb-4 w-full" : "size-full")}> <div className={cn(!isDesktop ? "mb-4 w-full md:max-w-lg" : "size-full")}>
<img <img
className="w-full select-none rounded-lg object-contain transition-opacity" className="w-full select-none rounded-lg object-contain transition-opacity"
style={ style={
@ -586,6 +594,11 @@ export default function SearchDetailDialog({
"max-h-[95dvh] sm:max-w-xl md:max-w-4xl lg:max-w-[70%]", "max-h-[95dvh] sm:max-w-xl md:max-w-4xl lg:max-w-[70%]",
isMobile && "flex h-full flex-col px-4", isMobile && "flex h-full flex-col px-4",
)} )}
onEscapeKeyDown={(event) => {
if (isPopoverOpen) {
event.preventDefault();
}
}}
onInteractOutside={(e) => { onInteractOutside={(e) => {
if (isPopoverOpen) { if (isPopoverOpen) {
e.preventDefault(); e.preventDefault();

2
web/src/components/overlay/detail/TrackingDetails.tsx
View File

@ -454,7 +454,7 @@ export function TrackingDetails({
)} )}
> >
{isDesktop && tabs && ( {isDesktop && tabs && (
<div className="mb-4 flex items-center justify-between"> <div className="mb-2 flex items-center justify-between">
<div className="flex-1">{tabs}</div> <div className="flex-1">{tabs}</div>
</div> </div>
)} )}