mirror of
https://github.com/BrenBroZAYT/gameyfin.git
synced 2026-06-16 16:20:04 +00:00
Finish theming implementation (finally...)
This commit is contained in:
grimsi
@@ -1,16 +0,0 @@
|
||||
import * as React from "react"
|
||||
import {Provider as JotaiProvider} from "jotai"
|
||||
import {ThemeProvider as NextThemesProvider} from "next-themes"
|
||||
import {ThemeProviderProps} from "next-themes/dist/types"
|
||||
import {TooltipProvider} from "Frontend/@/components/ui/tooltip";
|
||||
|
||||
|
||||
export function ThemeProvider({children, ...props}: ThemeProviderProps) {
|
||||
return (
|
||||
<JotaiProvider>
|
||||
<NextThemesProvider {...props}>
|
||||
<TooltipProvider delayDuration={0}>{children}</TooltipProvider>
|
||||
</NextThemesProvider>
|
||||
</JotaiProvider>
|
||||
)
|
||||
}
|
||||
@@ -1,7 +1,6 @@
|
||||
import * as React from "react"
|
||||
import {cva, type VariantProps} from "class-variance-authority"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
import {cn} from "Frontend/util/utils";
|
||||
|
||||
const alertVariants = cva(
|
||||
"relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7",
|
||||
|
||||
@@ -1,48 +0,0 @@
|
||||
import * as React from "react"
|
||||
import * as AvatarPrimitive from "@radix-ui/react-avatar"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
|
||||
const Avatar = React.forwardRef<
|
||||
React.ElementRef<typeof AvatarPrimitive.Root>,
|
||||
React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>
|
||||
>(({className, ...props}, ref) => (
|
||||
<AvatarPrimitive.Root
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
Avatar.displayName = AvatarPrimitive.Root.displayName
|
||||
|
||||
const AvatarImage = React.forwardRef<
|
||||
React.ElementRef<typeof AvatarPrimitive.Image>,
|
||||
React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>
|
||||
>(({className, ...props}, ref) => (
|
||||
<AvatarPrimitive.Image
|
||||
ref={ref}
|
||||
className={cn("aspect-square h-full w-full", className)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
AvatarImage.displayName = AvatarPrimitive.Image.displayName
|
||||
|
||||
const AvatarFallback = React.forwardRef<
|
||||
React.ElementRef<typeof AvatarPrimitive.Fallback>,
|
||||
React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>
|
||||
>(({className, ...props}, ref) => (
|
||||
<AvatarPrimitive.Fallback
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"flex h-full w-full items-center justify-center rounded-full bg-muted",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName
|
||||
|
||||
export {Avatar, AvatarImage, AvatarFallback}
|
||||
@@ -1,58 +0,0 @@
|
||||
import * as React from "react"
|
||||
import {Slot} from "@radix-ui/react-slot"
|
||||
import {cva, type VariantProps} from "class-variance-authority"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
|
||||
const buttonVariants = cva(
|
||||
"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
|
||||
{
|
||||
variants: {
|
||||
variant: {
|
||||
default:
|
||||
"bg-primary text-primary-foreground shadow hover:bg-primary/90",
|
||||
destructive:
|
||||
"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
|
||||
outline:
|
||||
"border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
|
||||
secondary:
|
||||
"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
|
||||
ghost: "hover:bg-accent hover:text-accent-foreground",
|
||||
link: "text-primary underline-offset-4 hover:underline",
|
||||
},
|
||||
size: {
|
||||
default: "h-9 px-4 py-2",
|
||||
sm: "h-8 rounded-md px-3 text-xs",
|
||||
lg: "h-10 rounded-md px-8",
|
||||
icon: "h-9 w-9",
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
variant: "default",
|
||||
size: "default",
|
||||
},
|
||||
}
|
||||
)
|
||||
|
||||
export interface ButtonProps
|
||||
extends React.ButtonHTMLAttributes<HTMLButtonElement>,
|
||||
VariantProps<typeof buttonVariants> {
|
||||
asChild?: boolean
|
||||
}
|
||||
|
||||
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
|
||||
({className, variant, size, asChild = false, ...props}, ref) => {
|
||||
const Comp = asChild ? Slot : "button"
|
||||
return (
|
||||
<Comp
|
||||
className={cn(buttonVariants({variant, size, className}))}
|
||||
ref={ref}
|
||||
type="button"
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
)
|
||||
Button.displayName = "Button"
|
||||
|
||||
export {Button, buttonVariants}
|
||||
@@ -1,79 +0,0 @@
|
||||
import * as React from "react"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
|
||||
const Card = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({className, ...props}, ref) => (
|
||||
<div
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"rounded-lg border bg-card text-card-foreground shadow-sm",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
Card.displayName = "Card"
|
||||
|
||||
const CardHeader = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({className, ...props}, ref) => (
|
||||
<div
|
||||
ref={ref}
|
||||
className={cn("flex flex-col space-y-1.5 p-6", className)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
CardHeader.displayName = "CardHeader"
|
||||
|
||||
const CardTitle = React.forwardRef<
|
||||
HTMLParagraphElement,
|
||||
React.HTMLAttributes<HTMLHeadingElement>
|
||||
>(({className, ...props}, ref) => (
|
||||
<h3
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"text-2xl font-semibold leading-none tracking-tight",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
CardTitle.displayName = "CardTitle"
|
||||
|
||||
const CardDescription = React.forwardRef<
|
||||
HTMLParagraphElement,
|
||||
React.HTMLAttributes<HTMLParagraphElement>
|
||||
>(({className, ...props}, ref) => (
|
||||
<p
|
||||
ref={ref}
|
||||
className={cn("text-sm text-muted-foreground", className)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
CardDescription.displayName = "CardDescription"
|
||||
|
||||
const CardContent = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({className, ...props}, ref) => (
|
||||
<div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
|
||||
))
|
||||
CardContent.displayName = "CardContent"
|
||||
|
||||
const CardFooter = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({className, ...props}, ref) => (
|
||||
<div
|
||||
ref={ref}
|
||||
className={cn("flex items-center p-6 pt-0", className)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
CardFooter.displayName = "CardFooter"
|
||||
|
||||
export {Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent}
|
||||
@@ -1,199 +0,0 @@
|
||||
import * as React from "react"
|
||||
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
|
||||
import {CheckIcon, ChevronRightIcon, DotFilledIcon,} from "@radix-ui/react-icons"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
|
||||
const DropdownMenu = DropdownMenuPrimitive.Root
|
||||
|
||||
const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger
|
||||
|
||||
const DropdownMenuGroup = DropdownMenuPrimitive.Group
|
||||
|
||||
const DropdownMenuPortal = DropdownMenuPrimitive.Portal
|
||||
|
||||
const DropdownMenuSub = DropdownMenuPrimitive.Sub
|
||||
|
||||
const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup
|
||||
|
||||
const DropdownMenuSubTrigger = React.forwardRef<
|
||||
React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,
|
||||
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {
|
||||
inset?: boolean
|
||||
}
|
||||
>(({className, inset, children, ...props}, ref) => (
|
||||
<DropdownMenuPrimitive.SubTrigger
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
|
||||
inset && "pl-8",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
<ChevronRightIcon className="ml-auto h-4 w-4"/>
|
||||
</DropdownMenuPrimitive.SubTrigger>
|
||||
))
|
||||
DropdownMenuSubTrigger.displayName =
|
||||
DropdownMenuPrimitive.SubTrigger.displayName
|
||||
|
||||
const DropdownMenuSubContent = React.forwardRef<
|
||||
React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
|
||||
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>
|
||||
>(({className, ...props}, ref) => (
|
||||
<DropdownMenuPrimitive.SubContent
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
DropdownMenuSubContent.displayName =
|
||||
DropdownMenuPrimitive.SubContent.displayName
|
||||
|
||||
const DropdownMenuContent = React.forwardRef<
|
||||
React.ElementRef<typeof DropdownMenuPrimitive.Content>,
|
||||
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
|
||||
>(({className, sideOffset = 4, ...props}, ref) => (
|
||||
<DropdownMenuPrimitive.Portal>
|
||||
<DropdownMenuPrimitive.Content
|
||||
ref={ref}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md",
|
||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
</DropdownMenuPrimitive.Portal>
|
||||
))
|
||||
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
|
||||
|
||||
const DropdownMenuItem = React.forwardRef<
|
||||
React.ElementRef<typeof DropdownMenuPrimitive.Item>,
|
||||
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {
|
||||
inset?: boolean
|
||||
}
|
||||
>(({className, inset, ...props}, ref) => (
|
||||
<DropdownMenuPrimitive.Item
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
||||
inset && "pl-8",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
|
||||
|
||||
const DropdownMenuCheckboxItem = React.forwardRef<
|
||||
React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,
|
||||
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>
|
||||
>(({className, children, checked, ...props}, ref) => (
|
||||
<DropdownMenuPrimitive.CheckboxItem
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
||||
className
|
||||
)}
|
||||
checked={checked}
|
||||
{...props}
|
||||
>
|
||||
<span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
|
||||
<DropdownMenuPrimitive.ItemIndicator>
|
||||
<CheckIcon className="h-4 w-4"/>
|
||||
</DropdownMenuPrimitive.ItemIndicator>
|
||||
</span>
|
||||
{children}
|
||||
</DropdownMenuPrimitive.CheckboxItem>
|
||||
))
|
||||
DropdownMenuCheckboxItem.displayName =
|
||||
DropdownMenuPrimitive.CheckboxItem.displayName
|
||||
|
||||
const DropdownMenuRadioItem = React.forwardRef<
|
||||
React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,
|
||||
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>
|
||||
>(({className, children, ...props}, ref) => (
|
||||
<DropdownMenuPrimitive.RadioItem
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
|
||||
<DropdownMenuPrimitive.ItemIndicator>
|
||||
<DotFilledIcon className="h-4 w-4 fill-current"/>
|
||||
</DropdownMenuPrimitive.ItemIndicator>
|
||||
</span>
|
||||
{children}
|
||||
</DropdownMenuPrimitive.RadioItem>
|
||||
))
|
||||
DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
|
||||
|
||||
const DropdownMenuLabel = React.forwardRef<
|
||||
React.ElementRef<typeof DropdownMenuPrimitive.Label>,
|
||||
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {
|
||||
inset?: boolean
|
||||
}
|
||||
>(({className, inset, ...props}, ref) => (
|
||||
<DropdownMenuPrimitive.Label
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"px-2 py-1.5 text-sm font-semibold",
|
||||
inset && "pl-8",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
|
||||
|
||||
const DropdownMenuSeparator = React.forwardRef<
|
||||
React.ElementRef<typeof DropdownMenuPrimitive.Separator>,
|
||||
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>
|
||||
>(({className, ...props}, ref) => (
|
||||
<DropdownMenuPrimitive.Separator
|
||||
ref={ref}
|
||||
className={cn("-mx-1 my-1 h-px bg-muted", className)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
|
||||
|
||||
const DropdownMenuShortcut = ({
|
||||
className,
|
||||
...props
|
||||
}: React.HTMLAttributes<HTMLSpanElement>) => {
|
||||
return (
|
||||
<span
|
||||
className={cn("ml-auto text-xs tracking-widest opacity-60", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
DropdownMenuShortcut.displayName = "DropdownMenuShortcut"
|
||||
|
||||
export {
|
||||
DropdownMenu,
|
||||
DropdownMenuTrigger,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuCheckboxItem,
|
||||
DropdownMenuRadioItem,
|
||||
DropdownMenuLabel,
|
||||
DropdownMenuSeparator,
|
||||
DropdownMenuShortcut,
|
||||
DropdownMenuGroup,
|
||||
DropdownMenuPortal,
|
||||
DropdownMenuSub,
|
||||
DropdownMenuSubContent,
|
||||
DropdownMenuSubTrigger,
|
||||
DropdownMenuRadioGroup,
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
import * as React from "react"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
|
||||
export interface InputProps
|
||||
extends React.InputHTMLAttributes<HTMLInputElement> {
|
||||
}
|
||||
|
||||
const Input = React.forwardRef<HTMLInputElement, InputProps>(
|
||||
({className, type, ...props}, ref) => {
|
||||
return (
|
||||
<input
|
||||
type={type}
|
||||
className={cn(
|
||||
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className
|
||||
)}
|
||||
ref={ref}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
)
|
||||
Input.displayName = "Input"
|
||||
|
||||
export {Input}
|
||||
@@ -1,24 +0,0 @@
|
||||
import * as React from "react"
|
||||
import * as LabelPrimitive from "@radix-ui/react-label"
|
||||
import {cva, type VariantProps} from "class-variance-authority"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
|
||||
const labelVariants = cva(
|
||||
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
|
||||
)
|
||||
|
||||
const Label = React.forwardRef<
|
||||
React.ElementRef<typeof LabelPrimitive.Root>,
|
||||
React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
|
||||
VariantProps<typeof labelVariants>
|
||||
>(({className, ...props}, ref) => (
|
||||
<LabelPrimitive.Root
|
||||
ref={ref}
|
||||
className={cn(labelVariants(), className)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
Label.displayName = LabelPrimitive.Root.displayName
|
||||
|
||||
export {Label}
|
||||
@@ -1,27 +0,0 @@
|
||||
import * as React from "react"
|
||||
import * as SwitchPrimitives from "@radix-ui/react-switch"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
|
||||
const Switch = React.forwardRef<
|
||||
React.ElementRef<typeof SwitchPrimitives.Root>,
|
||||
React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>
|
||||
>(({className, ...props}, ref) => (
|
||||
<SwitchPrimitives.Root
|
||||
className={cn(
|
||||
"peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
ref={ref}
|
||||
>
|
||||
<SwitchPrimitives.Thumb
|
||||
className={cn(
|
||||
"pointer-events-none block h-4 w-4 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
|
||||
)}
|
||||
/>
|
||||
</SwitchPrimitives.Root>
|
||||
))
|
||||
Switch.displayName = SwitchPrimitives.Root.displayName
|
||||
|
||||
export {Switch}
|
||||
@@ -1,28 +0,0 @@
|
||||
import * as React from "react"
|
||||
import * as TooltipPrimitive from "@radix-ui/react-tooltip"
|
||||
|
||||
import {cn} from "Frontend/@/lib/utils"
|
||||
|
||||
const TooltipProvider = TooltipPrimitive.Provider
|
||||
|
||||
const Tooltip = TooltipPrimitive.Root
|
||||
|
||||
const TooltipTrigger = TooltipPrimitive.Trigger
|
||||
|
||||
const TooltipContent = React.forwardRef<
|
||||
React.ElementRef<typeof TooltipPrimitive.Content>,
|
||||
React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
|
||||
>(({className, sideOffset = 4, ...props}, ref) => (
|
||||
<TooltipPrimitive.Content
|
||||
ref={ref}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
TooltipContent.displayName = TooltipPrimitive.Content.displayName
|
||||
|
||||
export {Tooltip, TooltipTrigger, TooltipContent, TooltipProvider}
|
||||
@@ -1,22 +0,0 @@
|
||||
import {useAtom} from "jotai"
|
||||
import {atomWithStorage} from "jotai/utils"
|
||||
|
||||
import {Theme} from "@/registry/themes"
|
||||
|
||||
type Config = {
|
||||
theme: {
|
||||
name: Theme["name"],
|
||||
mode: "light" | "dark" | "system"
|
||||
}
|
||||
}
|
||||
|
||||
const configAtom = atomWithStorage<Config>("config", {
|
||||
theme: {
|
||||
name: "zinc",
|
||||
mode: "system"
|
||||
}
|
||||
})
|
||||
|
||||
export function useConfig() {
|
||||
return useAtom(configAtom)
|
||||
}
|
||||
@@ -1,20 +0,0 @@
|
||||
import {type ClassValue, clsx} from "clsx"
|
||||
import {twMerge} from "tailwind-merge"
|
||||
|
||||
export function cn(...inputs: ClassValue[]) {
|
||||
return twMerge(clsx(inputs))
|
||||
}
|
||||
|
||||
export function cssVar(variable: string) {
|
||||
return getComputedStyle(document.documentElement).getPropertyValue(`--${variable}`);
|
||||
}
|
||||
|
||||
export function hsl(hsl: string) {
|
||||
return `hsl(${hsl}`;
|
||||
}
|
||||
|
||||
export function rand(min: number, max: number) {
|
||||
const minCeiled = Math.ceil(min);
|
||||
const maxFloored = Math.floor(max);
|
||||
return Math.floor(Math.random() * (maxFloored - minCeiled) + minCeiled);
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,478 +0,0 @@
|
||||
export const themes = [
|
||||
{
|
||||
name: "zinc",
|
||||
label: "Zinc",
|
||||
activeColor: {
|
||||
light: "240 5.9% 10%",
|
||||
dark: "240 5.2% 33.9%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "240 10% 3.9%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "240 10% 3.9%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "240 10% 3.9%",
|
||||
primary: "240 5.9% 10%",
|
||||
"primary-foreground": "0 0% 98%",
|
||||
secondary: "240 4.8% 95.9%",
|
||||
"secondary-foreground": "240 5.9% 10%",
|
||||
muted: "240 4.8% 95.9%",
|
||||
"muted-foreground": "240 3.8% 46.1%",
|
||||
accent: "240 4.8% 95.9%",
|
||||
"accent-foreground": "240 5.9% 10%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "0 0% 98%",
|
||||
border: "240 5.9% 90%",
|
||||
input: "240 5.9% 90%",
|
||||
ring: "240 5.9% 10%",
|
||||
radius: "0.5rem",
|
||||
},
|
||||
dark: {
|
||||
background: "240 10% 3.9%",
|
||||
foreground: "0 0% 98%",
|
||||
card: "240 10% 3.9%",
|
||||
"card-foreground": "0 0% 98%",
|
||||
popover: "240 10% 3.9%",
|
||||
"popover-foreground": "0 0% 98%",
|
||||
primary: "0 0% 98%",
|
||||
"primary-foreground": "240 5.9% 10%",
|
||||
secondary: "240 3.7% 15.9%",
|
||||
"secondary-foreground": "0 0% 98%",
|
||||
muted: "240 3.7% 15.9%",
|
||||
"muted-foreground": "240 5% 64.9%",
|
||||
accent: "240 3.7% 15.9%",
|
||||
"accent-foreground": "0 0% 98%",
|
||||
destructive: "0 62.8% 30.6%",
|
||||
"destructive-foreground": "0 0% 98%",
|
||||
border: "240 3.7% 15.9%",
|
||||
input: "240 3.7% 15.9%",
|
||||
ring: "240 4.9% 83.9%",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "slate",
|
||||
label: "Slate",
|
||||
activeColor: {
|
||||
light: "215.4 16.3% 46.9%",
|
||||
dark: "215.3 19.3% 34.5%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "222.2 84% 4.9%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "222.2 84% 4.9%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "222.2 84% 4.9%",
|
||||
primary: "222.2 47.4% 11.2%",
|
||||
"primary-foreground": "210 40% 98%",
|
||||
secondary: "210 40% 96.1%",
|
||||
"secondary-foreground": "222.2 47.4% 11.2%",
|
||||
muted: "210 40% 96.1%",
|
||||
"muted-foreground": "215.4 16.3% 46.9%",
|
||||
accent: "210 40% 96.1%",
|
||||
"accent-foreground": "222.2 47.4% 11.2%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "210 40% 98%",
|
||||
border: "214.3 31.8% 91.4%",
|
||||
input: "214.3 31.8% 91.4%",
|
||||
ring: "222.2 84% 4.9%",
|
||||
radius: "0.5rem",
|
||||
},
|
||||
dark: {
|
||||
background: "222.2 84% 4.9%",
|
||||
foreground: "210 40% 98%",
|
||||
card: "222.2 84% 4.9%",
|
||||
"card-foreground": "210 40% 98%",
|
||||
popover: "222.2 84% 4.9%",
|
||||
"popover-foreground": "210 40% 98%",
|
||||
primary: "210 40% 98%",
|
||||
"primary-foreground": "222.2 47.4% 11.2%",
|
||||
secondary: "217.2 32.6% 17.5%",
|
||||
"secondary-foreground": "210 40% 98%",
|
||||
muted: "217.2 32.6% 17.5%",
|
||||
"muted-foreground": "215 20.2% 65.1%",
|
||||
accent: "217.2 32.6% 17.5%",
|
||||
"accent-foreground": "210 40% 98%",
|
||||
destructive: "0 62.8% 30.6%",
|
||||
"destructive-foreground": "210 40% 98%",
|
||||
border: "217.2 32.6% 17.5%",
|
||||
input: "217.2 32.6% 17.5%",
|
||||
ring: "212.7 26.8% 83.9",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "red",
|
||||
label: "Red",
|
||||
activeColor: {
|
||||
light: "0 72.2% 50.6%",
|
||||
dark: "0 72.2% 50.6%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "0 0% 3.9%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "0 0% 3.9%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "0 0% 3.9%",
|
||||
primary: "0 72.2% 50.6%",
|
||||
"primary-foreground": "0 85.7% 97.3%",
|
||||
secondary: "0 0% 96.1%",
|
||||
"secondary-foreground": "0 0% 9%",
|
||||
muted: "0 0% 96.1%",
|
||||
"muted-foreground": "0 0% 45.1%",
|
||||
accent: "0 0% 96.1%",
|
||||
"accent-foreground": "0 0% 9%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "0 0% 98%",
|
||||
border: "0 0% 89.8%",
|
||||
input: "0 0% 89.8%",
|
||||
ring: "0 72.2% 50.6%",
|
||||
radius: "0.4rem",
|
||||
},
|
||||
dark: {
|
||||
background: "0 0% 3.9%",
|
||||
foreground: "0 0% 98%",
|
||||
card: "0 0% 3.9%",
|
||||
"card-foreground": "0 0% 98%",
|
||||
popover: "0 0% 3.9%",
|
||||
"popover-foreground": "0 0% 98%",
|
||||
primary: "0 72.2% 50.6%",
|
||||
"primary-foreground": "0 85.7% 97.3%",
|
||||
secondary: "0 0% 14.9%",
|
||||
"secondary-foreground": "0 0% 98%",
|
||||
muted: "0 0% 14.9%",
|
||||
"muted-foreground": "0 0% 63.9%",
|
||||
accent: "0 0% 14.9%",
|
||||
"accent-foreground": "0 0% 98%",
|
||||
destructive: "0 62.8% 30.6%",
|
||||
"destructive-foreground": "0 0% 98%",
|
||||
border: "0 0% 14.9%",
|
||||
input: "0 0% 14.9%",
|
||||
ring: "0 72.2% 50.6%",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "rose",
|
||||
label: "Rose",
|
||||
activeColor: {
|
||||
light: "346.8 77.2% 49.8%",
|
||||
dark: "346.8 77.2% 49.8%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "240 10% 3.9%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "240 10% 3.9%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "240 10% 3.9%",
|
||||
primary: "346.8 77.2% 49.8%",
|
||||
"primary-foreground": "355.7 100% 97.3%",
|
||||
secondary: "240 4.8% 95.9%",
|
||||
"secondary-foreground": "240 5.9% 10%",
|
||||
muted: "240 4.8% 95.9%",
|
||||
"muted-foreground": "240 3.8% 46.1%",
|
||||
accent: "240 4.8% 95.9%",
|
||||
"accent-foreground": "240 5.9% 10%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "0 0% 98%",
|
||||
border: "240 5.9% 90%",
|
||||
input: "240 5.9% 90%",
|
||||
ring: "346.8 77.2% 49.8%",
|
||||
radius: "0.5rem",
|
||||
},
|
||||
dark: {
|
||||
background: "20 14.3% 4.1%",
|
||||
foreground: "0 0% 95%",
|
||||
popover: "0 0% 9%",
|
||||
"popover-foreground": "0 0% 95%",
|
||||
card: "24 9.8% 10%",
|
||||
"card-foreground": "0 0% 95%",
|
||||
primary: "346.8 77.2% 49.8%",
|
||||
"primary-foreground": "355.7 100% 97.3%",
|
||||
secondary: "240 3.7% 15.9%",
|
||||
"secondary-foreground": "0 0% 98%",
|
||||
muted: "0 0% 15%",
|
||||
"muted-foreground": "240 5% 64.9%",
|
||||
accent: "12 6.5% 15.1%",
|
||||
"accent-foreground": "0 0% 98%",
|
||||
destructive: "0 62.8% 30.6%",
|
||||
"destructive-foreground": "0 85.7% 97.3%",
|
||||
border: "240 3.7% 15.9%",
|
||||
input: "240 3.7% 15.9%",
|
||||
ring: "346.8 77.2% 49.8%",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "orange",
|
||||
label: "Orange",
|
||||
activeColor: {
|
||||
light: "24.6 95% 53.1%",
|
||||
dark: "20.5 90.2% 48.2%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "20 14.3% 4.1%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "20 14.3% 4.1%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "20 14.3% 4.1%",
|
||||
primary: "24.6 95% 53.1%",
|
||||
"primary-foreground": "60 9.1% 97.8%",
|
||||
secondary: "60 4.8% 95.9%",
|
||||
"secondary-foreground": "24 9.8% 10%",
|
||||
muted: "60 4.8% 95.9%",
|
||||
"muted-foreground": "25 5.3% 44.7%",
|
||||
accent: "60 4.8% 95.9%",
|
||||
"accent-foreground": "24 9.8% 10%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "60 9.1% 97.8%",
|
||||
border: "20 5.9% 90%",
|
||||
input: "20 5.9% 90%",
|
||||
ring: "24.6 95% 53.1%",
|
||||
radius: "0.95rem",
|
||||
},
|
||||
dark: {
|
||||
background: "20 14.3% 4.1%",
|
||||
foreground: "60 9.1% 97.8%",
|
||||
card: "20 14.3% 4.1%",
|
||||
"card-foreground": "60 9.1% 97.8%",
|
||||
popover: "20 14.3% 4.1%",
|
||||
"popover-foreground": "60 9.1% 97.8%",
|
||||
primary: "20.5 90.2% 48.2%",
|
||||
"primary-foreground": "60 9.1% 97.8%",
|
||||
secondary: "12 6.5% 15.1%",
|
||||
"secondary-foreground": "60 9.1% 97.8%",
|
||||
muted: "12 6.5% 15.1%",
|
||||
"muted-foreground": "24 5.4% 63.9%",
|
||||
accent: "12 6.5% 15.1%",
|
||||
"accent-foreground": "60 9.1% 97.8%",
|
||||
destructive: "0 72.2% 50.6%",
|
||||
"destructive-foreground": "60 9.1% 97.8%",
|
||||
border: "12 6.5% 15.1%",
|
||||
input: "12 6.5% 15.1%",
|
||||
ring: "20.5 90.2% 48.2%",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "green",
|
||||
label: "Green",
|
||||
activeColor: {
|
||||
light: "142.1 76.2% 36.3%",
|
||||
dark: "142.1 70.6% 45.3%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "240 10% 3.9%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "240 10% 3.9%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "240 10% 3.9%",
|
||||
primary: "142.1 76.2% 36.3%",
|
||||
"primary-foreground": "355.7 100% 97.3%",
|
||||
secondary: "240 4.8% 95.9%",
|
||||
"secondary-foreground": "240 5.9% 10%",
|
||||
muted: "240 4.8% 95.9%",
|
||||
"muted-foreground": "240 3.8% 46.1%",
|
||||
accent: "240 4.8% 95.9%",
|
||||
"accent-foreground": "240 5.9% 10%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "0 0% 98%",
|
||||
border: "240 5.9% 90%",
|
||||
input: "240 5.9% 90%",
|
||||
ring: "142.1 76.2% 36.3%",
|
||||
},
|
||||
dark: {
|
||||
background: "20 14.3% 4.1%",
|
||||
foreground: "0 0% 95%",
|
||||
popover: "0 0% 9%",
|
||||
"popover-foreground": "0 0% 95%",
|
||||
card: "24 9.8% 10%",
|
||||
"card-foreground": "0 0% 95%",
|
||||
primary: "142.1 70.6% 45.3%",
|
||||
"primary-foreground": "144.9 80.4% 10%",
|
||||
secondary: "240 3.7% 15.9%",
|
||||
"secondary-foreground": "0 0% 98%",
|
||||
muted: "0 0% 15%",
|
||||
"muted-foreground": "240 5% 64.9%",
|
||||
accent: "12 6.5% 15.1%",
|
||||
"accent-foreground": "0 0% 98%",
|
||||
destructive: "0 62.8% 30.6%",
|
||||
"destructive-foreground": "0 85.7% 97.3%",
|
||||
border: "240 3.7% 15.9%",
|
||||
input: "240 3.7% 15.9%",
|
||||
ring: "142.4 71.8% 29.2%",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "blue",
|
||||
label: "Blue",
|
||||
activeColor: {
|
||||
light: "221.2 83.2% 53.3%",
|
||||
dark: "217.2 91.2% 59.8%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "222.2 84% 4.9%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "222.2 84% 4.9%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "222.2 84% 4.9%",
|
||||
primary: "221.2 83.2% 53.3%",
|
||||
"primary-foreground": "210 40% 98%",
|
||||
secondary: "210 40% 96.1%",
|
||||
"secondary-foreground": "222.2 47.4% 11.2%",
|
||||
muted: "210 40% 96.1%",
|
||||
"muted-foreground": "215.4 16.3% 46.9%",
|
||||
accent: "210 40% 96.1%",
|
||||
"accent-foreground": "222.2 47.4% 11.2%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "210 40% 98%",
|
||||
border: "214.3 31.8% 91.4%",
|
||||
input: "214.3 31.8% 91.4%",
|
||||
ring: "221.2 83.2% 53.3%",
|
||||
},
|
||||
dark: {
|
||||
background: "222.2 84% 4.9%",
|
||||
foreground: "210 40% 98%",
|
||||
card: "222.2 84% 4.9%",
|
||||
"card-foreground": "210 40% 98%",
|
||||
popover: "222.2 84% 4.9%",
|
||||
"popover-foreground": "210 40% 98%",
|
||||
primary: "217.2 91.2% 59.8%",
|
||||
"primary-foreground": "222.2 47.4% 11.2%",
|
||||
secondary: "217.2 32.6% 17.5%",
|
||||
"secondary-foreground": "210 40% 98%",
|
||||
muted: "217.2 32.6% 17.5%",
|
||||
"muted-foreground": "215 20.2% 65.1%",
|
||||
accent: "217.2 32.6% 17.5%",
|
||||
"accent-foreground": "210 40% 98%",
|
||||
destructive: "0 62.8% 30.6%",
|
||||
"destructive-foreground": "210 40% 98%",
|
||||
border: "217.2 32.6% 17.5%",
|
||||
input: "217.2 32.6% 17.5%",
|
||||
ring: "224.3 76.3% 48%",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "yellow",
|
||||
label: "Yellow",
|
||||
activeColor: {
|
||||
light: "47.9 95.8% 53.1%",
|
||||
dark: "47.9 95.8% 53.1%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "20 14.3% 4.1%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "20 14.3% 4.1%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "20 14.3% 4.1%",
|
||||
primary: "47.9 95.8% 53.1%",
|
||||
"primary-foreground": "26 83.3% 14.1%",
|
||||
secondary: "60 4.8% 95.9%",
|
||||
"secondary-foreground": "24 9.8% 10%",
|
||||
muted: "60 4.8% 95.9%",
|
||||
"muted-foreground": "25 5.3% 44.7%",
|
||||
accent: "60 4.8% 95.9%",
|
||||
"accent-foreground": "24 9.8% 10%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "60 9.1% 97.8%",
|
||||
border: "20 5.9% 90%",
|
||||
input: "20 5.9% 90%",
|
||||
ring: "20 14.3% 4.1%",
|
||||
radius: "0.95rem",
|
||||
},
|
||||
dark: {
|
||||
background: "20 14.3% 4.1%",
|
||||
foreground: "60 9.1% 97.8%",
|
||||
card: "20 14.3% 4.1%",
|
||||
"card-foreground": "60 9.1% 97.8%",
|
||||
popover: "20 14.3% 4.1%",
|
||||
"popover-foreground": "60 9.1% 97.8%",
|
||||
primary: "47.9 95.8% 53.1%",
|
||||
"primary-foreground": "26 83.3% 14.1%",
|
||||
secondary: "12 6.5% 15.1%",
|
||||
"secondary-foreground": "60 9.1% 97.8%",
|
||||
muted: "12 6.5% 15.1%",
|
||||
"muted-foreground": "24 5.4% 63.9%",
|
||||
accent: "12 6.5% 15.1%",
|
||||
"accent-foreground": "60 9.1% 97.8%",
|
||||
destructive: "0 62.8% 30.6%",
|
||||
"destructive-foreground": "60 9.1% 97.8%",
|
||||
border: "12 6.5% 15.1%",
|
||||
input: "12 6.5% 15.1%",
|
||||
ring: "35.5 91.7% 32.9%",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "violet",
|
||||
label: "Violet",
|
||||
activeColor: {
|
||||
light: "262.1 83.3% 57.8%",
|
||||
dark: "263.4 70% 50.4%",
|
||||
},
|
||||
cssVars: {
|
||||
light: {
|
||||
background: "0 0% 100%",
|
||||
foreground: "224 71.4% 4.1%",
|
||||
card: "0 0% 100%",
|
||||
"card-foreground": "224 71.4% 4.1%",
|
||||
popover: "0 0% 100%",
|
||||
"popover-foreground": "224 71.4% 4.1%",
|
||||
primary: "262.1 83.3% 57.8%",
|
||||
"primary-foreground": "210 20% 98%",
|
||||
secondary: "220 14.3% 95.9%",
|
||||
"secondary-foreground": "220.9 39.3% 11%",
|
||||
muted: "220 14.3% 95.9%",
|
||||
"muted-foreground": "220 8.9% 46.1%",
|
||||
accent: "220 14.3% 95.9%",
|
||||
"accent-foreground": "220.9 39.3% 11%",
|
||||
destructive: "0 84.2% 60.2%",
|
||||
"destructive-foreground": "210 20% 98%",
|
||||
border: "220 13% 91%",
|
||||
input: "220 13% 91%",
|
||||
ring: "262.1 83.3% 57.8%",
|
||||
},
|
||||
dark: {
|
||||
background: "224 71.4% 4.1%",
|
||||
foreground: "210 20% 98%",
|
||||
card: "224 71.4% 4.1%",
|
||||
"card-foreground": "210 20% 98%",
|
||||
popover: "224 71.4% 4.1%",
|
||||
"popover-foreground": "210 20% 98%",
|
||||
primary: "263.4 70% 50.4%",
|
||||
"primary-foreground": "210 20% 98%",
|
||||
secondary: "215 27.9% 16.9%",
|
||||
"secondary-foreground": "210 20% 98%",
|
||||
muted: "215 27.9% 16.9%",
|
||||
"muted-foreground": "217.9 10.6% 64.9%",
|
||||
accent: "215 27.9% 16.9%",
|
||||
"accent-foreground": "210 20% 98%",
|
||||
destructive: "0 62.8% 30.6%",
|
||||
"destructive-foreground": "210 20% 98%",
|
||||
border: "215 27.9% 16.9%",
|
||||
input: "215 27.9% 16.9%",
|
||||
ring: "263.4 70% 50.4%",
|
||||
},
|
||||
},
|
||||
},
|
||||
] as const
|
||||
|
||||
export type Theme = (typeof themes)[number]
|
||||
Reference in New Issue
Block a user