mirror of
https://github.com/blakeblackshear/frigate.git
synced 2024-11-21 19:07:46 +01:00
use portal on all sidebar tooltips (#11267)
This commit is contained in:
parent
ca8ef70096
commit
306c11d730
@ -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>
|
||||
<TooltipContent className="capitalize" side="right">
|
||||
All Cameras
|
||||
</TooltipContent>
|
||||
<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>
|
||||
<TooltipContent className="capitalize" side="right">
|
||||
{name}
|
||||
</TooltipContent>
|
||||
<TooltipPortal>
|
||||
<TooltipContent className="capitalize" side="right">
|
||||
{name}
|
||||
</TooltipContent>
|
||||
</TooltipPortal>
|
||||
</Tooltip>
|
||||
);
|
||||
})}
|
||||
|
@ -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>
|
||||
<TooltipContent side="right">
|
||||
<p>Account</p>
|
||||
</TooltipContent>
|
||||
<TooltipPortal>
|
||||
<TooltipContent side="right">
|
||||
<p>Account</p>
|
||||
</TooltipContent>
|
||||
</TooltipPortal>
|
||||
</Tooltip>
|
||||
);
|
||||
}
|
||||
|
@ -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>
|
||||
<TooltipContent side="right">
|
||||
<p>Settings</p>
|
||||
</TooltipContent>
|
||||
<TooltipPortal>
|
||||
<TooltipContent side="right">
|
||||
<p>Settings</p>
|
||||
</TooltipContent>
|
||||
</TooltipPortal>
|
||||
</Tooltip>
|
||||
</a>
|
||||
</Trigger>
|
||||
|
Loading…
Reference in New Issue
Block a user