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

Settings fixes

Browse Source
This commit is contained in:
Nicolas Mowen 2024-05-18 13:53:39 -06:00
parent 3ce8816b9a
commit dc17791758
3 changed files with 61 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -34,55 +34,51 @@ export default function AccountSettings({ className }: AccountSettingsProps) {
const MenuItem = isDesktop ? DropdownMenuItem : DialogClose; const MenuItem = isDesktop ? DropdownMenuItem : DialogClose;
return ( return (
<div className={className}> <Container>
<Container> <Trigger asChild>
<Trigger asChild> <Tooltip>
<a href="#"> <TooltipTrigger asChild>
<Tooltip> <div
<TooltipTrigger asChild> className={cn(
<div "flex flex-col items-center justify-center",
className={cn( isDesktop
"flex flex-col items-center justify-center", ? "cursor-pointer rounded-lg bg-secondary text-secondary-foreground hover:bg-muted"
isDesktop : "text-secondary-foreground",
? "cursor-pointer rounded-lg bg-secondary text-secondary-foreground hover:bg-muted" className,
: "text-secondary-foreground", )}
className,
)}
>
<VscAccount className="size-5 md:m-[6px]" />
</div>
</TooltipTrigger>
<TooltipPortal>
<TooltipContent side="right">
<p>Account</p>
</TooltipContent>
</TooltipPortal>
</Tooltip>
</a>
</Trigger>
<Content
className={
isDesktop ? "mr-5 w-72" : "max-h-[75dvh] overflow-hidden p-2"
}
>
<div className="w-full flex-col overflow-y-auto overflow-x-hidden">
<DropdownMenuLabel>
Current User: {profile?.username || "anonymous"}
</DropdownMenuLabel>
<DropdownMenuSeparator className={isDesktop ? "mt-3" : "mt-1"} />
<MenuItem
className={
isDesktop ? "cursor-pointer" : "flex items-center p-2 text-sm"
}
> >
<a className="flex" href={logoutUrl}> <VscAccount className="size-5 md:m-[6px]" />
<LuLogOut className="mr-2 size-4" /> </div>
<span>Logout</span> </TooltipTrigger>
</a> <TooltipPortal>
</MenuItem> <TooltipContent side="right">
</div> <p>Account</p>
</Content> </TooltipContent>
</Container> </TooltipPortal>
</div> </Tooltip>
</Trigger>
<Content
className={
isDesktop ? "mr-5 w-72" : "max-h-[75dvh] overflow-hidden p-2"
}
>
<div className="w-full flex-col overflow-y-auto overflow-x-hidden">
<DropdownMenuLabel>
Current User: {profile?.username || "anonymous"}
</DropdownMenuLabel>
<DropdownMenuSeparator className={isDesktop ? "mt-3" : "mt-1"} />
<MenuItem
className={
isDesktop ? "cursor-pointer" : "flex items-center p-2 text-sm"
}
>
<a className="flex" href={logoutUrl}>
<LuLogOut className="mr-2 size-4" />
<span>Logout</span>
</a>
</MenuItem>
</div>
</Content>
</Container>
); );
} }

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

@ -116,22 +116,20 @@ export default function GeneralSettings({ className }: GeneralSettingsProps) {
<div className={className}> <div className={className}>
<Container> <Container>
<Trigger asChild> <Trigger asChild>
<a href="#"> <Tooltip>
<Tooltip> <TooltipTrigger asChild>
<TooltipTrigger asChild> <div
<div className={`flex flex-col items-center justify-center ${isDesktop ? "cursor-pointer rounded-lg bg-secondary text-secondary-foreground hover:bg-muted" : "text-secondary-foreground"}`}
className={`flex flex-col items-center justify-center ${isDesktop ? "cursor-pointer rounded-lg bg-secondary text-secondary-foreground hover:bg-muted" : "text-secondary-foreground"}`} >
> <LuSettings className="size-5 md:m-[6px]" />
<LuSettings className="size-5 md:m-[6px]" /> </div>
</div> </TooltipTrigger>
</TooltipTrigger> <TooltipPortal>
<TooltipPortal> <TooltipContent side="right">
<TooltipContent side="right"> <p>Settings</p>
<p>Settings</p> </TooltipContent>
</TooltipContent> </TooltipPortal>
</TooltipPortal> </Tooltip>
</Tooltip>
</a>
</Trigger> </Trigger>
<Content <Content
className={ className={

4
web/src/components/navigation/Bottombar.tsx
View File

@ -15,7 +15,7 @@ import {
} from "@/context/statusbar-provider"; } from "@/context/statusbar-provider";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { isMobile } from "react-device-detect"; import { isIOS, isMobile } from "react-device-detect";
import { isPWA } from "@/utils/isPWA"; import { isPWA } from "@/utils/isPWA";
function Bottombar() { function Bottombar() {
@ -25,7 +25,7 @@ function Bottombar() {
<div <div
className={cn( className={cn(
"absolute inset-x-4 bottom-0 flex h-16 flex-row justify-between", "absolute inset-x-4 bottom-0 flex h-16 flex-row justify-between",
isPWA isPWA && isIOS
? "portrait:items-start portrait:pt-1 landscape:items-center" ? "portrait:items-start portrait:pt-1 landscape:items-center"
: "items-center", : "items-center",
isMobile && !isPWA && "h-12 landscape:md:h-16", isMobile && !isPWA && "h-12 landscape:md:h-16",