mirror of
https://github.com/fosrl/pangolin.git
synced 2025-05-12 13:20:35 +01:00
adjust border
This commit is contained in:
parent
1a750e8279
commit
419e576a3e
31 changed files with 118 additions and 112 deletions
|
@ -29,17 +29,17 @@ const navItems = [
|
|||
{
|
||||
title: "Sites",
|
||||
href: "/{orgId}/settings/sites",
|
||||
icon: <Combine className="h-4 w-4" />
|
||||
// icon: <Combine className="h-4 w-4" />
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
href: "/{orgId}/settings/resources",
|
||||
icon: <Waypoints className="h-4 w-4" />
|
||||
// icon: <Waypoints className="h-4 w-4" />
|
||||
},
|
||||
{
|
||||
title: "Access Control",
|
||||
href: "/{orgId}/settings/access",
|
||||
icon: <Users className="h-4 w-4" />,
|
||||
// icon: <Users className="h-4 w-4" />,
|
||||
children: [
|
||||
{
|
||||
title: "Users",
|
||||
|
@ -54,12 +54,12 @@ const navItems = [
|
|||
{
|
||||
title: "Shareable Links",
|
||||
href: "/{orgId}/settings/share-links",
|
||||
icon: <LinkIcon className="h-4 w-4" />
|
||||
// icon: <LinkIcon className="h-4 w-4" />
|
||||
},
|
||||
{
|
||||
title: "General",
|
||||
href: "/{orgId}/settings/general",
|
||||
icon: <Settings className="h-4 w-4" />
|
||||
// icon: <Settings className="h-4 w-4" />
|
||||
}
|
||||
];
|
||||
|
||||
|
|
|
@ -104,20 +104,6 @@ export default async function ResourceLayout(props: ResourceLayoutProps) {
|
|||
|
||||
return (
|
||||
<>
|
||||
<div className="mb-4">
|
||||
<Breadcrumb>
|
||||
<BreadcrumbList>
|
||||
<BreadcrumbItem>
|
||||
<Link href="../">Resources</Link>
|
||||
</BreadcrumbItem>
|
||||
<BreadcrumbSeparator />
|
||||
<BreadcrumbItem>
|
||||
<BreadcrumbPage>{resource.name}</BreadcrumbPage>
|
||||
</BreadcrumbItem>
|
||||
</BreadcrumbList>
|
||||
</Breadcrumb>
|
||||
</div>
|
||||
|
||||
<SettingsSectionTitle
|
||||
title={`${resource?.name} Settings`}
|
||||
description="Configure the settings on your resource"
|
||||
|
|
|
@ -284,7 +284,7 @@ export default function SitesTable({ sites, orgId }: SitesTableProps) {
|
|||
<ConfirmDeleteDialog
|
||||
open={isDeleteModalOpen}
|
||||
setOpen={setIsDeleteModalOpen}
|
||||
onConfirm={() => deleteSite(selectedSite.id)}
|
||||
onConfirm={async () => deleteSite(selectedSite.id)}
|
||||
title="Delete Site"
|
||||
description="Are you sure you want to delete this site? This action cannot be undone."
|
||||
/>
|
||||
|
|
|
@ -46,13 +46,18 @@ export default async function SettingsLayout(props: SettingsLayoutProps) {
|
|||
];
|
||||
|
||||
return (
|
||||
<SiteProvider site={site}>
|
||||
<div className="space-y-6">
|
||||
<SiteInfoCard />
|
||||
<HorizontalTabs items={navItems}>
|
||||
{children}
|
||||
</HorizontalTabs>
|
||||
</div>
|
||||
</SiteProvider>
|
||||
<>
|
||||
<SettingsSectionTitle
|
||||
title={`${site?.name} Settings`}
|
||||
description="Configure the settings on your site"
|
||||
/>
|
||||
|
||||
<SiteProvider site={site}>
|
||||
<div className="space-y-6">
|
||||
<SiteInfoCard />
|
||||
<HorizontalTabs items={navItems}>{children}</HorizontalTabs>
|
||||
</div>
|
||||
</SiteProvider>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -502,20 +502,6 @@ WantedBy=default.target`
|
|||
|
||||
return (
|
||||
<>
|
||||
<div className="mb-4 flex-row">
|
||||
<Breadcrumb>
|
||||
<BreadcrumbList>
|
||||
<BreadcrumbItem>
|
||||
<Link href="../">Sites</Link>
|
||||
</BreadcrumbItem>
|
||||
<BreadcrumbSeparator />
|
||||
<BreadcrumbItem>
|
||||
<BreadcrumbPage>Create Site</BreadcrumbPage>
|
||||
</BreadcrumbItem>
|
||||
</BreadcrumbList>
|
||||
</Breadcrumb>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-between">
|
||||
<HeaderTitle
|
||||
title="Create Site"
|
||||
|
|
|
@ -18,7 +18,7 @@ export default async function AuthLayout({ children }: AuthLayoutProps) {
|
|||
const user = await getUser();
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="h-full flex flex-col">
|
||||
{user && (
|
||||
<UserProvider user={user}>
|
||||
<div className="p-3">
|
||||
|
@ -27,9 +27,11 @@ export default async function AuthLayout({ children }: AuthLayoutProps) {
|
|||
</UserProvider>
|
||||
)}
|
||||
|
||||
<div className="w-full max-w-md mx-auto p-3 md:mt-32">
|
||||
{children}
|
||||
<div className="flex-1 flex items-center justify-center">
|
||||
<div className="w-full max-w-md p-3">
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -30,7 +30,7 @@ export default function SupporterMessage({ tier }: { tier: string }) {
|
|||
Pangolin
|
||||
</span>
|
||||
<Star className="w-3 h-3"/>
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 -top-10 hidden group-hover:block text-primary text-sm rounded-md border-2 shadow-md px-4 py-2 pointer-events-none opacity-0 group-hover:opacity-100 transition-opacity">
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 -top-10 hidden group-hover:block text-primary text-sm rounded-md border shadow-md px-4 py-2 pointer-events-none opacity-0 group-hover:opacity-100 transition-opacity">
|
||||
Thank you for supporting Pangolin as a {tier}!
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
:root {
|
||||
--background: hsl(0 0% 100%);
|
||||
--background: hsl(0 0% 98%);
|
||||
--foreground: hsl(20 0% 10%);
|
||||
--card: hsl(0 0% 100%);
|
||||
--card-foreground: hsl(20 0% 10%);
|
||||
|
@ -22,7 +22,7 @@
|
|||
--border: hsl(20 5.9% 80%);
|
||||
--input: hsl(20 5.9% 75%);
|
||||
--ring: hsl(24.6 95% 53.1%);
|
||||
--radius: 0.75rem;
|
||||
--radius: 0.50rem;
|
||||
--chart-1: hsl(12 76% 61%);
|
||||
--chart-2: hsl(173 58% 39%);
|
||||
--chart-3: hsl(197 37% 24%);
|
||||
|
@ -31,7 +31,7 @@
|
|||
}
|
||||
|
||||
.dark {
|
||||
--background: hsl(20 0% 10%);
|
||||
--background: hsl(20 0% 8%);
|
||||
--foreground: hsl(60 9.1% 97.8%);
|
||||
--card: hsl(20 0% 10%);
|
||||
--card-foreground: hsl(60 9.1% 97.8%);
|
||||
|
@ -47,7 +47,7 @@
|
|||
--accent-foreground: hsl(60 9.1% 97.8%);
|
||||
--destructive: hsl(0 72.2% 50.6%);
|
||||
--destructive-foreground: hsl(60 9.1% 97.8%);
|
||||
--border: hsl(12 6.5% 30%);
|
||||
--border: hsl(12 6.5% 15%);
|
||||
--input: hsl(12 6.5% 35%);
|
||||
--ring: hsl(20.5 90.2% 48.2%);
|
||||
--chart-1: hsl(220 70% 50%);
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import type { Metadata } from "next";
|
||||
import "./globals.css";
|
||||
import { Figtree, Inter } from "next/font/google";
|
||||
import { Figtree, Inter, Red_Hat_Display, Red_Hat_Mono, Red_Hat_Text, Space_Grotesk } from "next/font/google";
|
||||
import { Toaster } from "@/components/ui/toaster";
|
||||
import { ThemeProvider } from "@app/providers/ThemeProvider";
|
||||
import EnvProvider from "@app/providers/EnvProvider";
|
||||
|
@ -43,7 +43,7 @@ export default async function RootLayout({
|
|||
|
||||
return (
|
||||
<html suppressHydrationWarning>
|
||||
<body className={`${font.className} min-h-screen flex flex-col`}>
|
||||
<body className={`${font.className} h-screen overflow-hidden`}>
|
||||
<ThemeProvider
|
||||
attribute="class"
|
||||
defaultTheme="system"
|
||||
|
@ -53,8 +53,8 @@ export default async function RootLayout({
|
|||
<EnvProvider env={pullEnv()}>
|
||||
<SupportStatusProvider supporterStatus={supporterData}>
|
||||
{/* Main content */}
|
||||
<div className="flex flex-col min-h-screen">
|
||||
<div className="flex-1">
|
||||
<div className="h-full flex flex-col">
|
||||
<div className="flex-1 overflow-auto">
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -47,19 +47,17 @@ export function Breadcrumbs() {
|
|||
});
|
||||
|
||||
return (
|
||||
<div className="border-b px-4 py-2">
|
||||
<div className="border-b px-4 py-2 overflow-x-auto scrollbar-hide bg-card">
|
||||
<nav className="flex items-center space-x-1 text-sm text-muted-foreground">
|
||||
<Link href="/" className="hover:text-foreground">
|
||||
Home
|
||||
</Link>
|
||||
{breadcrumbs.map((crumb, index) => (
|
||||
<div key={crumb.href} className="flex items-center">
|
||||
<ChevronRight className="h-4 w-4" />
|
||||
{index !== 0 && <ChevronRight className="h-4 w-4" />}
|
||||
<Link
|
||||
href={crumb.href}
|
||||
className={cn(
|
||||
"ml-1 hover:text-foreground",
|
||||
index === breadcrumbs.length - 1 && "text-foreground font-medium"
|
||||
index === breadcrumbs.length - 1 &&
|
||||
"text-foreground font-medium"
|
||||
)}
|
||||
>
|
||||
{crumb.label}
|
||||
|
@ -69,4 +67,4 @@ export function Breadcrumbs() {
|
|||
</nav>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -28,7 +28,7 @@ export default function CopyTextBox({
|
|||
|
||||
return (
|
||||
<div
|
||||
className={`relative w-full border-2 rounded-md ${!outline ? "bg-muted" : "bg-card"}`}
|
||||
className={`relative w-full border rounded-md ${!outline ? "bg-muted" : "bg-card"}`}
|
||||
>
|
||||
<pre
|
||||
ref={textRef}
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
import Link from "next/link";
|
||||
import { useEnvContext } from "@app/hooks/useEnvContext";
|
||||
import Image from "next/image";
|
||||
|
||||
interface HeaderProps {
|
||||
orgId?: string;
|
||||
|
@ -14,7 +15,13 @@ export function Header({ orgId, orgs }: HeaderProps) {
|
|||
return (
|
||||
<div className="flex items-center justify-between w-full">
|
||||
<Link href="/" className="flex items-center space-x-2">
|
||||
<span className="font-bold">Pangolin</span>
|
||||
<Image
|
||||
src="/logo/pangolin_orange.svg"
|
||||
alt="Pangolin Logo"
|
||||
width={34}
|
||||
height={34}
|
||||
/>
|
||||
<span className="font-bold text-2xl">Pangolin</span>
|
||||
</Link>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -25,7 +25,10 @@ export function HorizontalTabs({
|
|||
const params = useParams();
|
||||
|
||||
function hydrateHref(href: string) {
|
||||
return href.replace("{orgId}", params.orgId as string);
|
||||
return href
|
||||
.replace("{orgId}", params.orgId as string)
|
||||
.replace("{resourceId}", params.resourceId as string)
|
||||
.replace("{niceId}", params.niceId as string);
|
||||
}
|
||||
|
||||
return (
|
||||
|
@ -35,7 +38,9 @@ export function HorizontalTabs({
|
|||
<div className="flex space-x-4 border-b min-w-max">
|
||||
{items.map((item) => {
|
||||
const hydratedHref = hydrateHref(item.href);
|
||||
const isActive = pathname.startsWith(hydratedHref) && !pathname.includes("create");
|
||||
const isActive =
|
||||
pathname.startsWith(hydratedHref) &&
|
||||
!pathname.includes("create");
|
||||
|
||||
return (
|
||||
<Link
|
||||
|
@ -48,7 +53,11 @@ export function HorizontalTabs({
|
|||
: "text-muted-foreground hover:text-foreground",
|
||||
disabled && "cursor-not-allowed"
|
||||
)}
|
||||
onClick={disabled ? (e) => e.preventDefault() : undefined}
|
||||
onClick={
|
||||
disabled
|
||||
? (e) => e.preventDefault()
|
||||
: undefined
|
||||
}
|
||||
tabIndex={disabled ? -1 : undefined}
|
||||
aria-disabled={disabled}
|
||||
>
|
||||
|
@ -66,9 +75,7 @@ export function HorizontalTabs({
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-6">
|
||||
{children}
|
||||
</div>
|
||||
<div className="space-y-6">{children}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -11,7 +11,13 @@ import SupporterStatus from "@app/components/SupporterStatus";
|
|||
import { Separator } from "@app/components/ui/separator";
|
||||
import { Button } from "@app/components/ui/button";
|
||||
import { Menu, X } from "lucide-react";
|
||||
import { Sheet, SheetContent, SheetTrigger, SheetTitle, SheetDescription } from "@app/components/ui/sheet";
|
||||
import {
|
||||
Sheet,
|
||||
SheetContent,
|
||||
SheetTrigger,
|
||||
SheetTitle,
|
||||
SheetDescription
|
||||
} from "@app/components/ui/sheet";
|
||||
import { useEnvContext } from "@app/hooks/useEnvContext";
|
||||
import { Breadcrumbs } from "@app/components/Breadcrumbs";
|
||||
|
||||
|
@ -39,24 +45,29 @@ export function Layout({ children, orgId, orgs, navItems }: LayoutProps) {
|
|||
<div className="flex h-screen overflow-hidden">
|
||||
{/* Mobile Menu Button */}
|
||||
<div className="md:hidden fixed top-4 left-4 z-50">
|
||||
<Sheet open={isMobileMenuOpen} onOpenChange={setIsMobileMenuOpen}>
|
||||
<Sheet
|
||||
open={isMobileMenuOpen}
|
||||
onOpenChange={setIsMobileMenuOpen}
|
||||
>
|
||||
<SheetTrigger asChild>
|
||||
<Button variant="ghost" size="icon">
|
||||
<Menu className="h-6 w-6" />
|
||||
</Button>
|
||||
</SheetTrigger>
|
||||
<SheetContent side="left" className="w-64 p-0">
|
||||
<SheetTitle className="sr-only">Navigation Menu</SheetTitle>
|
||||
<SheetContent side="left" className="w-64 p-0 flex flex-col h-full">
|
||||
<SheetTitle className="sr-only">
|
||||
Navigation Menu
|
||||
</SheetTitle>
|
||||
<SheetDescription className="sr-only">
|
||||
Main navigation menu for the application
|
||||
</SheetDescription>
|
||||
<div className="flex h-16 items-center border-b px-4">
|
||||
<div className="flex h-16 items-center border-b px-4 shrink-0">
|
||||
<Header orgId={orgId} orgs={orgs} />
|
||||
</div>
|
||||
<div className="flex-1 overflow-y-auto p-4">
|
||||
<SidebarNav items={navItems} />
|
||||
</div>
|
||||
<div className="p-4 space-y-4 border-t">
|
||||
<div className="p-4 space-y-4 border-t shrink-0">
|
||||
<SupporterStatus />
|
||||
<OrgSelector orgId={orgId} orgs={orgs} />
|
||||
{env?.app?.version && (
|
||||
|
@ -80,17 +91,22 @@ export function Layout({ children, orgId, orgs, navItems }: LayoutProps) {
|
|||
<div className="p-4 space-y-4 border-t shrink-0">
|
||||
<SupporterStatus />
|
||||
<OrgSelector orgId={orgId} orgs={orgs} />
|
||||
{env?.app?.version && (
|
||||
<div className="space-y-2">
|
||||
<div className="text-xs text-muted-foreground text-center">
|
||||
v{env.app.version}
|
||||
Open Source
|
||||
</div>
|
||||
)}
|
||||
{env?.app?.version && (
|
||||
<div className="text-xs text-muted-foreground text-center">
|
||||
v{env.app.version}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Main content */}
|
||||
<div className="flex-1 flex flex-col h-full min-w-0">
|
||||
<div className="h-16 border-b shrink-0">
|
||||
<div className="h-16 border-b shrink-0 bg-card">
|
||||
<div className="flex h-full items-center justify-end px-4">
|
||||
<TopBar orgId={orgId} orgs={orgs} />
|
||||
</div>
|
||||
|
|
|
@ -66,7 +66,7 @@ export default function ProfileIcon() {
|
|||
<Enable2FaForm open={openEnable2fa} setOpen={setOpenEnable2fa} />
|
||||
<Disable2FaForm open={openDisable2fa} setOpen={setOpenDisable2fa} />
|
||||
|
||||
<div className="flex items-center md:gap-4 grow min-w-0">
|
||||
<div className="flex items-center md:gap-4 grow min-w-0 gap-2 md:gap-0">
|
||||
<span className="truncate max-w-full font-medium min-w-0">
|
||||
{user.email}
|
||||
</span>
|
||||
|
|
|
@ -42,7 +42,7 @@ export function SidebarNav({
|
|||
function renderItems(items: SidebarNavItem[]) {
|
||||
return items.map((item) => {
|
||||
const hydratedHref = hydrateHref(item.href);
|
||||
const isActive = pathname.startsWith(hydratedHref) && !pathname.includes("create");
|
||||
const isActive = pathname.startsWith(hydratedHref);
|
||||
|
||||
return (
|
||||
<div key={hydratedHref}>
|
||||
|
|
|
@ -44,7 +44,7 @@ export function StrategySelect<TValue extends string>({
|
|||
selected === option.id ? "checked" : "unchecked"
|
||||
}
|
||||
className={cn(
|
||||
"relative flex rounded-lg border-2 p-4 transition-colors cursor-pointer",
|
||||
"relative flex rounded-lg border p-4 transition-colors cursor-pointer",
|
||||
option.disabled
|
||||
? "border-input text-muted-foreground cursor-not-allowed opacity-50"
|
||||
: selected === option.id
|
||||
|
|
|
@ -10,8 +10,8 @@ interface TopBarProps {
|
|||
|
||||
export function TopBar({ orgId, orgs }: TopBarProps) {
|
||||
return (
|
||||
<div className="flex items-center justify-between w-full h-full">
|
||||
<div className="flex items-center space-x-4">
|
||||
<div className="flex items-center justify-end md:justify-between w-full h-full">
|
||||
<div className="hidden md:flex items-center space-x-4">
|
||||
<Link
|
||||
href="https://docs.fossorial.io"
|
||||
target="_blank"
|
||||
|
|
|
@ -221,7 +221,7 @@ export const Autocomplete: React.FC<AutocompleteProps> = ({
|
|||
modal={usePortal}
|
||||
>
|
||||
<div
|
||||
className="relative h-full flex items-center rounded-md border-2 bg-transparent pr-3"
|
||||
className="relative h-full flex items-center rounded-md border bg-transparent pr-3"
|
||||
ref={triggerContainerRef}
|
||||
>
|
||||
{childrenWithProps}
|
||||
|
|
|
@ -496,7 +496,7 @@ const TagInput = (
|
|||
<div className="w-full">
|
||||
<div
|
||||
className={cn(
|
||||
`flex flex-row flex-wrap items-center gap-1.5 p-1.5 w-full rounded-md border-2 border-input bg-background text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 bg-transparent`,
|
||||
`flex flex-row flex-wrap items-center gap-1.5 p-1.5 w-full rounded-md border border-input bg-background text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 bg-transparent`,
|
||||
styleClasses?.inlineTagsContainer
|
||||
)}
|
||||
>
|
||||
|
|
|
@ -9,11 +9,11 @@ const alertVariants = cva(
|
|||
variants: {
|
||||
variant: {
|
||||
default: "bg-card border text-foreground",
|
||||
neutral: "bg-card border-2 text-foreground",
|
||||
neutral: "bg-card border text-foreground",
|
||||
destructive:
|
||||
"border-destructive/50 border-2 bg-destructive/10 text-destructive dark:border-destructive [&>svg]:text-destructive",
|
||||
"border-destructive/50 border bg-destructive/10 text-destructive dark:border-destructive [&>svg]:text-destructive",
|
||||
success:
|
||||
"border-green-500/50 border-2 bg-green-500/10 text-green-500 dark:border-success [&>svg]:text-green-500",
|
||||
"border-green-500/50 border bg-green-500/10 text-green-500 dark:border-success [&>svg]:text-green-500",
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
|
|
|
@ -15,16 +15,16 @@ const buttonVariants = cva(
|
|||
destructive:
|
||||
"bg-destructive text-destructive-foreground hover:bg-destructive/90",
|
||||
outline:
|
||||
"border-2 border-input bg-card hover:bg-accent hover:text-accent-foreground",
|
||||
"border border-input bg-card hover:bg-accent hover:text-accent-foreground",
|
||||
outlinePrimary:
|
||||
"border-2 border-primary bg-card hover:bg-primary/10 text-primary",
|
||||
"border border-primary bg-card hover:bg-primary/10 text-primary",
|
||||
secondary:
|
||||
"bg-secondary border border-input border-2 text-secondary-foreground hover:bg-secondary/80",
|
||||
"bg-secondary border border-input border text-secondary-foreground hover:bg-secondary/80",
|
||||
ghost: "hover:bg-accent hover:text-accent-foreground",
|
||||
squareOutlinePrimary:
|
||||
"border-2 border-primary bg-card hover:bg-primary/10 text-primary rounded-md",
|
||||
"border border-primary bg-card hover:bg-primary/10 text-primary rounded-md",
|
||||
squareOutline:
|
||||
"border-2 border-input bg-card hover:bg-accent hover:text-accent-foreground rounded-md",
|
||||
"border border-input bg-card hover:bg-accent hover:text-accent-foreground rounded-md",
|
||||
squareDefault:
|
||||
"bg-primary text-primary-foreground hover:bg-primary/90 rounded-md",
|
||||
text: "",
|
||||
|
|
|
@ -14,13 +14,13 @@ const checkboxVariants = cva(
|
|||
variants: {
|
||||
variant: {
|
||||
outlinePrimary:
|
||||
"border-2 rounded-sm border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
|
||||
"border rounded-sm border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
|
||||
outline:
|
||||
"border-2 rounded-sm border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground",
|
||||
"border rounded-sm border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground",
|
||||
outlinePrimarySquare:
|
||||
"border-2 rounded-[20%] border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
|
||||
"border rounded-[20%] border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
|
||||
outlineSquare:
|
||||
"border-2 rounded-[20%] border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground"
|
||||
"border rounded-[20%] border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground"
|
||||
}
|
||||
},
|
||||
defaultVariants: {
|
||||
|
|
|
@ -52,7 +52,7 @@ const DropdownMenuSubContent = (
|
|||
) => (<DropdownMenuPrimitive.SubContent
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"z-50 min-w-[8rem] overflow-hidden rounded-md border-2 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",
|
||||
"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}
|
||||
|
@ -74,7 +74,7 @@ const DropdownMenuContent = (
|
|||
ref={ref}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"z-50 min-w-[8rem] overflow-hidden rounded-md border-2 bg-popover p-1 text-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",
|
||||
"z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-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}
|
||||
|
|
|
@ -23,7 +23,7 @@ const Input = (
|
|||
<input
|
||||
type={showPassword ? "text" : "password"}
|
||||
className={cn(
|
||||
"flex h-9 w-full rounded-md border-2 border-input bg-card px-3 py-2 text-base md:text-sm ring-offset-background file:border-0 file:bg-transparent file:text-base md:file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
"flex h-9 w-full rounded-md border border-input bg-card px-3 py-2 text-base md:text-sm ring-offset-background file:border-0 file:bg-transparent file:text-base md:file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className
|
||||
)}
|
||||
ref={ref}
|
||||
|
@ -47,7 +47,7 @@ const Input = (
|
|||
<input
|
||||
type={type}
|
||||
className={cn(
|
||||
"flex h-9 w-full rounded-md border-2 border-input bg-card px-3 py-2 text-base md:text-sm ring-offset-background file:border-0 file:bg-transparent file:text-base md:file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
"flex h-9 w-full rounded-md border border-input bg-card px-3 py-2 text-base md:text-sm ring-offset-background file:border-0 file:bg-transparent file:text-base md:file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className
|
||||
)}
|
||||
ref={ref}
|
||||
|
|
|
@ -37,7 +37,7 @@ const PopoverContent = (
|
|||
align={align}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"z-50 w-72 rounded-md border-2 bg-popover p-4 text-popover-foreground shadow-md outline-hidden 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",
|
||||
"z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden 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}
|
||||
|
|
|
@ -38,7 +38,7 @@ const RadioGroupItem = (
|
|||
<RadioGroupPrimitive.Item
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"aspect-square h-4 w-4 rounded-full border-2 border-primary text-primary ring-offset-background focus:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
"aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
|
|
|
@ -24,7 +24,7 @@ const SelectTrigger = (
|
|||
) => (<SelectPrimitive.Trigger
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"flex h-9 w-full items-center justify-between border-2 border-input bg-card px-3 py-2 text-base md:text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
||||
"flex h-9 w-full items-center justify-between border border-input bg-card px-3 py-2 text-base md:text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
||||
"rounded-md",
|
||||
className
|
||||
)}
|
||||
|
@ -92,7 +92,7 @@ const SelectContent = (
|
|||
<SelectPrimitive.Content
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border-2 bg-popover 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",
|
||||
"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover 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",
|
||||
position === "popper" &&
|
||||
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
||||
className
|
||||
|
|
|
@ -15,7 +15,7 @@ const Switch = (
|
|||
}
|
||||
) => (<SwitchPrimitives.Root
|
||||
className={cn(
|
||||
"peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-hidden 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",
|
||||
"peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border border-transparent transition-colors focus-visible:outline-hidden 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}
|
||||
|
|
|
@ -68,7 +68,7 @@ const TableRow = React.forwardRef<
|
|||
<tr
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
|
||||
"border-b transition-colors data-[state=selected]:bg-muted",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
|
|
|
@ -17,8 +17,7 @@
|
|||
"@server/*": ["../server/*"],
|
||||
"@test/*": ["../test/*"],
|
||||
"@app/*": ["*"],
|
||||
"@/*": ["./*"],
|
||||
"react": [ "./node_modules/@types/react" ]
|
||||
"@/*": ["./*"]
|
||||
},
|
||||
"plugins": [
|
||||
{
|
||||
|
|
Loading…
Reference in a new issue