Mirrors/blakeblackshear.frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2024-11-21 19:07:46 +01:00
Code Issues Projects Releases Wiki Activity

use portal on all sidebar tooltips (#11267)

Browse Source
This commit is contained in:
Josh Hawkins 2024-05-06 12:18:28 -05:00 committed by GitHub
parent ca8ef70096
commit 306c11d730
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 23 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
web/src/components/filter/CameraGroupSelector.tsx
View File

@ -59,6 +59,7 @@ import { Toaster } from "@/components/ui/sonner";
import { toast } from "sonner";
import ActivityIndicator from "../indicators/activity-indicator";
import { ScrollArea, ScrollBar } from "../ui/scroll-area";
import { TooltipPortal } from "@radix-ui/react-tooltip";
type CameraGroupSelectorProps = {
className?: string;
@ -137,9 +138,11 @@ export function CameraGroupSelector({ className }: CameraGroupSelectorProps) {
<MdHome className="size-4" />
</Button>
</TooltipTrigger>
<TooltipPortal>
<TooltipContent className="capitalize" side="right">
All Cameras
</TooltipContent>
</TooltipPortal>
</Tooltip>
{groups.map(([name, config]) => {
return (
@ -161,9 +164,11 @@ export function CameraGroupSelector({ className }: CameraGroupSelectorProps) {
{getIconForGroup(config.icon)}
</Button>
</TooltipTrigger>
<TooltipPortal>
<TooltipContent className="capitalize" side="right">
{name}
</TooltipContent>
</TooltipPortal>
</Tooltip>
);
})}

3
web/src/components/menu/AccountSettings.tsx
View File

@ -3,6 +3,7 @@ import {
TooltipContent,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { TooltipPortal } from "@radix-ui/react-tooltip";
import { isDesktop } from "react-device-detect";
import { VscAccount } from "react-icons/vsc";
@ -19,9 +20,11 @@ export default function AccountSettings({ className }: AccountSettingsProps) {
<VscAccount className="size-5 md:m-[6px]" />
</div>
</TooltipTrigger>
<TooltipPortal>
<TooltipContent side="right">
<p>Account</p>
</TooltipContent>
</TooltipPortal>
</Tooltip>
);
}

3
web/src/components/menu/GeneralSettings.tsx
View File

@ -65,6 +65,7 @@ import {
DialogPortal,
DialogTrigger,
} from "../ui/dialog";
import { TooltipPortal } from "@radix-ui/react-tooltip";
type GeneralSettingsProps = {
className?: string;
@ -124,9 +125,11 @@ export default function GeneralSettings({ className }: GeneralSettingsProps) {
<LuSettings className="size-5 md:m-[6px]" />
</div>
</TooltipTrigger>
<TooltipPortal>
<TooltipContent side="right">
<p>Settings</p>
</TooltipContent>
</TooltipPortal>
</Tooltip>
</a>
</Trigger>