adjust border

src/app/[orgId]/settings/layout.tsx

@@ -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" />
     }
 ];
 

src/app/[orgId]/settings/resources/[resourceId]/layout.tsx

@@ -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"

src/app/[orgId]/settings/sites/SitesTable.tsx

@@ -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."
                 />

src/app/[orgId]/settings/sites/[niceId]/layout.tsx

@@ -46,13 +46,18 @@ export default async function SettingsLayout(props: SettingsLayoutProps) {
     ];
 
     return (
-        <SiteProvider site={site}>
+        <>
-            <div className="space-y-6">
+            <SettingsSectionTitle
-                <SiteInfoCard />
+                title={`${site?.name} Settings`}
-                <HorizontalTabs items={navItems}>
+                description="Configure the settings on your site"
-                    {children}
+            />
-                </HorizontalTabs>
+
-            </div>
+            <SiteProvider site={site}>
-        </SiteProvider>
+                <div className="space-y-6">
+                    <SiteInfoCard />
+                    <HorizontalTabs items={navItems}>{children}</HorizontalTabs>
+                </div>
+            </SiteProvider>
+        </>
     );
 }

src/app/[orgId]/settings/sites/create/page.tsx

@@ -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"

src/app/auth/layout.tsx

@@ -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">
+            <div className="flex-1 flex items-center justify-center">
-                {children}
+                <div className="w-full max-w-md p-3">
+                    {children}
+                </div>
             </div>
-        </>
+        </div>
     );
 }

src/app/components/SupporterMessage.tsx

@@ -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>

src/app/globals.css

@@ -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%);

src/app/layout.tsx

@@ -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="h-full flex flex-col">
-                                <div className="flex-1">
+                                <div className="flex-1 overflow-auto">
                                     {children}
                                 </div>
                             </div>

src/components/Breadcrumbs.tsx

@@ -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}

src/components/CopyTextBox.tsx

@@ -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}

src/components/Header.tsx

@@ -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>
     );

src/components/HorizontalTabs.tsx

@@ -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">
+            <div className="space-y-6">{children}</div>
-                {children}
-            </div>
         </div>
     );
 }

src/components/Layout.tsx

@@ -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">
+                    <SheetContent side="left" className="w-64 p-0 flex flex-col h-full">
-                        <SheetTitle className="sr-only">Navigation Menu</SheetTitle>
+                        <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>

src/components/ProfileIcon.tsx

@@ -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>

src/components/SidebarNav.tsx

@@ -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}>

src/components/StrategySelect.tsx

@@ -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

src/components/TopBar.tsx

@@ -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 justify-end md:justify-between w-full h-full">
-            <div className="flex items-center space-x-4">
+            <div className="hidden md:flex items-center space-x-4">
                 <Link
                     href="https://docs.fossorial.io"
                     target="_blank"

src/components/tags/autocomplete.tsx

@@ -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}

src/components/tags/tag-input.tsx

@@ -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
                                 )}
                             >

src/components/ui/alert.tsx

@@ -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: {

src/components/ui/button.tsx

@@ -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: "",

src/components/ui/checkbox.tsx

@@ -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: {

src/components/ui/dropdown-menu.tsx

@@ -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}

src/components/ui/input.tsx

@@ -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}

src/components/ui/popover.tsx

@@ -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}

src/components/ui/radio-group.tsx

@@ -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}

src/components/ui/select.tsx

@@ -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

src/components/ui/switch.tsx

@@ -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}

src/components/ui/table.tsx

@@ -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}

tsconfig.json

@@ -17,8 +17,7 @@
             "@server/*": ["../server/*"],
             "@test/*": ["../test/*"],
             "@app/*": ["*"],
-            "@/*": ["./*"],
+            "@/*": ["./*"]
-            "react": [ "./node_modules/@types/react" ]
         },
         "plugins": [
             {