diff --git a/src/components/app-sidebar.tsx b/src/components/app-sidebar.tsx index b36cfba..539f63e 100755 --- a/src/components/app-sidebar.tsx +++ b/src/components/app-sidebar.tsx @@ -160,32 +160,6 @@ export function AppSidebar({ return ( - - - - - - - COMPASS - - - - - diff --git a/src/components/org-switcher.tsx b/src/components/org-switcher.tsx index bc0d891..bcb766a 100644 --- a/src/components/org-switcher.tsx +++ b/src/components/org-switcher.tsx @@ -5,16 +5,18 @@ import { useRouter } from "next/navigation" import { IconBuilding, IconCheck, - IconChevronDown, + IconSelector, IconUser, } from "@tabler/icons-react" -import { getUserOrganizations, switchOrganization } from "@/app/actions/organizations" +import { + getUserOrganizations, + switchOrganization, +} from "@/app/actions/organizations" import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, - DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu" @@ -24,7 +26,6 @@ import { SidebarMenuItem, useSidebar, } from "@/components/ui/sidebar" -import { Badge } from "@/components/ui/badge" import { cn } from "@/lib/utils" type OrgInfo = { @@ -41,7 +42,7 @@ export function OrgSwitcher({ }: { readonly activeOrgId: string | null readonly activeOrgName: string | null -}): React.ReactElement | null { +}): React.ReactElement { const router = useRouter() const { isMobile } = useSidebar() const [orgs, setOrgs] = React.useState([]) @@ -69,40 +70,41 @@ export function OrgSwitcher({ } } - if (!activeOrgId || !activeOrgName) { - return null - } - - const activeOrg = orgs.find((org) => org.id === activeOrgId) - const orgInitial = activeOrgName[0]?.toUpperCase() ?? "O" + const displayName = activeOrgName ?? "Compass" + const hasOrgs = orgs.length > 1 return ( - + -
- {activeOrg?.type === "personal" ? ( - - ) : ( - - )} -
-
- - {activeOrgName} - - {activeOrg && ( - - {activeOrg.role} - - )} -
- + + + {displayName} + + {hasOrgs && ( + + )}
- - Organizations - - - {orgs.map((org) => { + {orgs.map((org, i) => { const isActive = org.id === activeOrgId - const orgIcon = + const OrgIcon = org.type === "personal" ? IconUser : IconBuilding return ( - void handleOrgSwitch(org.id)} - disabled={isLoading} - className={cn( - "flex items-center gap-2 px-2 py-1.5", - isActive && "bg-accent" - )} - > -
- {React.createElement(orgIcon, { className: "size-3" })} -
-
- + + {i > 0 && } + void handleOrgSwitch(org.id)} + disabled={isLoading} + className="gap-2 px-2 py-1.5" + > + + {org.name} - - {org.role} - -
- - {org.type} - - {isActive && ( - - )} -
+ {isActive && ( + + )} + + ) })}
diff --git a/src/lib/theme/presets.ts b/src/lib/theme/presets.ts index 58098f1..62cbf66 100755 --- a/src/lib/theme/presets.ts +++ b/src/lib/theme/presets.ts @@ -1202,6 +1202,611 @@ export const THEME_PRESETS: ReadonlyArray = [ foreground: "oklch(0.4063 0.0255 40.3627)", }, }, + + { + id: "warm-luxury", + name: "Warm Luxury", + description: "Rich burgundy and gold tones with warm neutrals", + light: { + "background": "oklch(0.9779 0.0042 56.3756)", + "foreground": "oklch(0.2178 0 0)", + "card": "oklch(0.9779 0.0042 56.3756)", + "card-foreground": "oklch(0.2178 0 0)", + "popover": "oklch(0.9779 0.0042 56.3756)", + "popover-foreground": "oklch(0.2178 0 0)", + "primary": "oklch(0.4650 0.1470 24.9381)", + "primary-foreground": "oklch(1.0000 0 0)", + "secondary": "oklch(0.9625 0.0385 89.0943)", + "secondary-foreground": "oklch(0.4847 0.1022 75.1153)", + "muted": "oklch(0.9431 0.0068 53.4442)", + "muted-foreground": "oklch(0.4444 0.0096 73.6390)", + "accent": "oklch(0.9619 0.0580 95.6174)", + "accent-foreground": "oklch(0.3958 0.1331 25.7230)", + "destructive": "oklch(0.4437 0.1613 26.8994)", + "destructive-foreground": "oklch(1.0000 0 0)", + "border": "oklch(0.9355 0.0324 80.9937)", + "input": "oklch(0.9355 0.0324 80.9937)", + "ring": "oklch(0.4650 0.1470 24.9381)", + "chart-1": "oklch(0.5054 0.1905 27.5181)", + "chart-2": "oklch(0.4650 0.1470 24.9381)", + "chart-3": "oklch(0.3958 0.1331 25.7230)", + "chart-4": "oklch(0.5553 0.1455 48.9975)", + "chart-5": "oklch(0.4732 0.1247 46.2007)", + "sidebar": "oklch(0.9431 0.0068 53.4442)", + "sidebar-foreground": "oklch(0.2178 0 0)", + "sidebar-primary": "oklch(0.4650 0.1470 24.9381)", + "sidebar-primary-foreground": "oklch(1.0000 0 0)", + "sidebar-accent": "oklch(0.9619 0.0580 95.6174)", + "sidebar-accent-foreground": "oklch(0.3958 0.1331 25.7230)", + "sidebar-border": "oklch(0.9355 0.0324 80.9937)", + "sidebar-ring": "oklch(0.4650 0.1470 24.9381)", + }, + dark: { + "background": "oklch(0.2161 0.0061 56.0434)", + "foreground": "oklch(0.9699 0.0013 106.4238)", + "card": "oklch(0.2685 0.0063 34.2976)", + "card-foreground": "oklch(0.9699 0.0013 106.4238)", + "popover": "oklch(0.2685 0.0063 34.2976)", + "popover-foreground": "oklch(0.9699 0.0013 106.4238)", + "primary": "oklch(0.5054 0.1905 27.5181)", + "primary-foreground": "oklch(0.9779 0.0042 56.3756)", + "secondary": "oklch(0.4732 0.1247 46.2007)", + "secondary-foreground": "oklch(0.9619 0.0580 95.6174)", + "muted": "oklch(0.2291 0.0060 56.0708)", + "muted-foreground": "oklch(0.8687 0.0043 56.3660)", + "accent": "oklch(0.5553 0.1455 48.9975)", + "accent-foreground": "oklch(0.9619 0.0580 95.6174)", + "destructive": "oklch(0.6368 0.2078 25.3313)", + "destructive-foreground": "oklch(1.0000 0 0)", + "border": "oklch(0.3741 0.0087 67.5582)", + "input": "oklch(0.3741 0.0087 67.5582)", + "ring": "oklch(0.5054 0.1905 27.5181)", + "chart-1": "oklch(0.7106 0.1661 22.2162)", + "chart-2": "oklch(0.6368 0.2078 25.3313)", + "chart-3": "oklch(0.5771 0.2152 27.3250)", + "chart-4": "oklch(0.8369 0.1644 84.4286)", + "chart-5": "oklch(0.7686 0.1647 70.0804)", + "sidebar": "oklch(0.2161 0.0061 56.0434)", + "sidebar-foreground": "oklch(0.9699 0.0013 106.4238)", + "sidebar-primary": "oklch(0.5054 0.1905 27.5181)", + "sidebar-primary-foreground": "oklch(0.9779 0.0042 56.3756)", + "sidebar-accent": "oklch(0.5553 0.1455 48.9975)", + "sidebar-accent-foreground": "oklch(0.9619 0.0580 95.6174)", + "sidebar-border": "oklch(0.3741 0.0087 67.5582)", + "sidebar-ring": "oklch(0.5054 0.1905 27.5181)", + }, + fonts: { + sans: "Poppins, sans-serif", + serif: "Libre Baskerville, serif", + mono: "IBM Plex Mono, monospace", + }, + fontSources: { + googleFonts: ["Poppins", "Libre Baskerville", "IBM Plex Mono"], + }, + tokens: { + radius: "0.375rem", + spacing: "0.25rem", + trackingNormal: "0em", + shadowColor: "hsl(0 63% 18%)", + shadowOpacity: "0.12", + shadowBlur: "16px", + shadowSpread: "-2px", + shadowOffsetX: "1px", + shadowOffsetY: "1px", + }, + shadows: { + light: { + "2xs": "1px 1px 16px -2px hsl(0 63% 18% / 0.06)", + xs: "1px 1px 16px -2px hsl(0 63% 18% / 0.06)", + sm: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 1px 2px -3px hsl(0 63% 18% / 0.12)", + default: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 1px 2px -3px hsl(0 63% 18% / 0.12)", + md: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 2px 4px -3px hsl(0 63% 18% / 0.12)", + lg: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 4px 6px -3px hsl(0 63% 18% / 0.12)", + xl: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 8px 10px -3px hsl(0 63% 18% / 0.12)", + "2xl": "1px 1px 16px -2px hsl(0 63% 18% / 0.30)", + }, + dark: { + "2xs": "1px 1px 16px -2px hsl(0 63% 18% / 0.06)", + xs: "1px 1px 16px -2px hsl(0 63% 18% / 0.06)", + sm: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 1px 2px -3px hsl(0 63% 18% / 0.12)", + default: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 1px 2px -3px hsl(0 63% 18% / 0.12)", + md: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 2px 4px -3px hsl(0 63% 18% / 0.12)", + lg: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 4px 6px -3px hsl(0 63% 18% / 0.12)", + xl: "1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 8px 10px -3px hsl(0 63% 18% / 0.12)", + "2xl": "1px 1px 16px -2px hsl(0 63% 18% / 0.30)", + }, + }, + isPreset: true, + previewColors: { + primary: "oklch(0.4650 0.1470 24.9381)", + background: "oklch(0.9779 0.0042 56.3756)", + foreground: "oklch(0.2178 0 0)", + }, + }, + + { + id: "black-white", + name: "Black & White", + description: "Pure monochrome with zero chroma", + light: { + "background": "oklch(0.9900 0 0)", + "foreground": "oklch(0 0 0)", + "card": "oklch(1 0 0)", + "card-foreground": "oklch(0 0 0)", + "popover": "oklch(0.9900 0 0)", + "popover-foreground": "oklch(0 0 0)", + "primary": "oklch(0 0 0)", + "primary-foreground": "oklch(1 0 0)", + "secondary": "oklch(0.9400 0 0)", + "secondary-foreground": "oklch(0 0 0)", + "muted": "oklch(0.9700 0 0)", + "muted-foreground": "oklch(0.4400 0 0)", + "accent": "oklch(0.9400 0 0)", + "accent-foreground": "oklch(0 0 0)", + "destructive": "oklch(0.6300 0.1900 23.0300)", + "destructive-foreground": "oklch(1 0 0)", + "border": "oklch(0.9200 0 0)", + "input": "oklch(0.9400 0 0)", + "ring": "oklch(0 0 0)", + "chart-1": "oklch(0.8100 0.1700 75.3500)", + "chart-2": "oklch(0.5500 0.2200 264.5300)", + "chart-3": "oklch(0.7200 0 0)", + "chart-4": "oklch(0.9200 0 0)", + "chart-5": "oklch(0.5600 0 0)", + "sidebar": "oklch(0.9900 0 0)", + "sidebar-foreground": "oklch(0 0 0)", + "sidebar-primary": "oklch(0 0 0)", + "sidebar-primary-foreground": "oklch(1 0 0)", + "sidebar-accent": "oklch(0.9400 0 0)", + "sidebar-accent-foreground": "oklch(0 0 0)", + "sidebar-border": "oklch(0.9400 0 0)", + "sidebar-ring": "oklch(0 0 0)", + }, + dark: { + "background": "oklch(0 0 0)", + "foreground": "oklch(1 0 0)", + "card": "oklch(0.1400 0 0)", + "card-foreground": "oklch(1 0 0)", + "popover": "oklch(0.1800 0 0)", + "popover-foreground": "oklch(1 0 0)", + "primary": "oklch(1 0 0)", + "primary-foreground": "oklch(0 0 0)", + "secondary": "oklch(0.2500 0 0)", + "secondary-foreground": "oklch(1 0 0)", + "muted": "oklch(0.2300 0 0)", + "muted-foreground": "oklch(0.7200 0 0)", + "accent": "oklch(0.3200 0 0)", + "accent-foreground": "oklch(1 0 0)", + "destructive": "oklch(0.6900 0.2000 23.9100)", + "destructive-foreground": "oklch(0 0 0)", + "border": "oklch(0.2600 0 0)", + "input": "oklch(0.3200 0 0)", + "ring": "oklch(0.7200 0 0)", + "chart-1": "oklch(0.8100 0.1700 75.3500)", + "chart-2": "oklch(0.5800 0.2100 260.8400)", + "chart-3": "oklch(0.5600 0 0)", + "chart-4": "oklch(0.4400 0 0)", + "chart-5": "oklch(0.9200 0 0)", + "sidebar": "oklch(0.1800 0 0)", + "sidebar-foreground": "oklch(1 0 0)", + "sidebar-primary": "oklch(1 0 0)", + "sidebar-primary-foreground": "oklch(0 0 0)", + "sidebar-accent": "oklch(0.3200 0 0)", + "sidebar-accent-foreground": "oklch(1 0 0)", + "sidebar-border": "oklch(0.3200 0 0)", + "sidebar-ring": "oklch(0.7200 0 0)", + }, + fonts: { + sans: "Geist, sans-serif", + serif: "Georgia, serif", + mono: "Geist Mono, monospace", + }, + fontSources: { + googleFonts: ["Geist", "Geist Mono"], + }, + tokens: { + radius: "0.5rem", + spacing: "0.25rem", + trackingNormal: "0em", + shadowColor: "hsl(0 0% 0%)", + shadowOpacity: "0.18", + shadowBlur: "2px", + shadowSpread: "0px", + shadowOffsetX: "0px", + shadowOffsetY: "1px", + }, + shadows: { + light: { + "2xs": "0px 1px 2px 0px hsl(0 0% 0% / 0.09)", + xs: "0px 1px 2px 0px hsl(0 0% 0% / 0.09)", + sm: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 1px 2px -1px hsl(0 0% 0% / 0.18)", + default: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 1px 2px -1px hsl(0 0% 0% / 0.18)", + md: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 2px 4px -1px hsl(0 0% 0% / 0.18)", + lg: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 4px 6px -1px hsl(0 0% 0% / 0.18)", + xl: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 8px 10px -1px hsl(0 0% 0% / 0.18)", + "2xl": "0px 1px 2px 0px hsl(0 0% 0% / 0.45)", + }, + dark: { + "2xs": "0px 1px 2px 0px hsl(0 0% 0% / 0.09)", + xs: "0px 1px 2px 0px hsl(0 0% 0% / 0.09)", + sm: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 1px 2px -1px hsl(0 0% 0% / 0.18)", + default: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 1px 2px -1px hsl(0 0% 0% / 0.18)", + md: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 2px 4px -1px hsl(0 0% 0% / 0.18)", + lg: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 4px 6px -1px hsl(0 0% 0% / 0.18)", + xl: "0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 8px 10px -1px hsl(0 0% 0% / 0.18)", + "2xl": "0px 1px 2px 0px hsl(0 0% 0% / 0.45)", + }, + }, + isPreset: true, + previewColors: { + primary: "oklch(0 0 0)", + background: "oklch(0.9900 0 0)", + foreground: "oklch(0 0 0)", + }, + }, + + { + id: "tweeter", + name: "Tweeter", + description: "Twitter-inspired blue with clean, shadowless surfaces", + light: { + "background": "oklch(1.0000 0 0)", + "foreground": "oklch(0.1884 0.0128 248.5103)", + "card": "oklch(0.9784 0.0011 197.1387)", + "card-foreground": "oklch(0.1884 0.0128 248.5103)", + "popover": "oklch(1.0000 0 0)", + "popover-foreground": "oklch(0.1884 0.0128 248.5103)", + "primary": "oklch(0.6723 0.1606 244.9955)", + "primary-foreground": "oklch(1.0000 0 0)", + "secondary": "oklch(0.1884 0.0128 248.5103)", + "secondary-foreground": "oklch(1.0000 0 0)", + "muted": "oklch(0.9222 0.0013 286.3737)", + "muted-foreground": "oklch(0.1884 0.0128 248.5103)", + "accent": "oklch(0.9392 0.0166 250.8453)", + "accent-foreground": "oklch(0.6723 0.1606 244.9955)", + "destructive": "oklch(0.6188 0.2376 25.7658)", + "destructive-foreground": "oklch(1.0000 0 0)", + "border": "oklch(0.9317 0.0118 231.6594)", + "input": "oklch(0.9809 0.0025 228.7836)", + "ring": "oklch(0.6818 0.1584 243.3540)", + "chart-1": "oklch(0.6723 0.1606 244.9955)", + "chart-2": "oklch(0.6907 0.1554 160.3454)", + "chart-3": "oklch(0.8214 0.1600 82.5337)", + "chart-4": "oklch(0.7064 0.1822 151.7125)", + "chart-5": "oklch(0.5919 0.2186 10.5826)", + "sidebar": "oklch(0.9784 0.0011 197.1387)", + "sidebar-foreground": "oklch(0.1884 0.0128 248.5103)", + "sidebar-primary": "oklch(0.6723 0.1606 244.9955)", + "sidebar-primary-foreground": "oklch(1.0000 0 0)", + "sidebar-accent": "oklch(0.9392 0.0166 250.8453)", + "sidebar-accent-foreground": "oklch(0.6723 0.1606 244.9955)", + "sidebar-border": "oklch(0.9271 0.0101 238.5177)", + "sidebar-ring": "oklch(0.6818 0.1584 243.3540)", + }, + dark: { + "background": "oklch(0 0 0)", + "foreground": "oklch(0.9328 0.0025 228.7857)", + "card": "oklch(0.2097 0.0080 274.5332)", + "card-foreground": "oklch(0.8853 0 0)", + "popover": "oklch(0 0 0)", + "popover-foreground": "oklch(0.9328 0.0025 228.7857)", + "primary": "oklch(0.6692 0.1607 245.0110)", + "primary-foreground": "oklch(1.0000 0 0)", + "secondary": "oklch(0.9622 0.0035 219.5331)", + "secondary-foreground": "oklch(0.1884 0.0128 248.5103)", + "muted": "oklch(0.2090 0 0)", + "muted-foreground": "oklch(0.5637 0.0078 247.9662)", + "accent": "oklch(0.1928 0.0331 242.5459)", + "accent-foreground": "oklch(0.6692 0.1607 245.0110)", + "destructive": "oklch(0.6188 0.2376 25.7658)", + "destructive-foreground": "oklch(1.0000 0 0)", + "border": "oklch(0.2674 0.0047 248.0045)", + "input": "oklch(0.3020 0.0288 244.8244)", + "ring": "oklch(0.6818 0.1584 243.3540)", + "chart-1": "oklch(0.6723 0.1606 244.9955)", + "chart-2": "oklch(0.6907 0.1554 160.3454)", + "chart-3": "oklch(0.8214 0.1600 82.5337)", + "chart-4": "oklch(0.7064 0.1822 151.7125)", + "chart-5": "oklch(0.5919 0.2186 10.5826)", + "sidebar": "oklch(0.2097 0.0080 274.5332)", + "sidebar-foreground": "oklch(0.8853 0 0)", + "sidebar-primary": "oklch(0.6818 0.1584 243.3540)", + "sidebar-primary-foreground": "oklch(1.0000 0 0)", + "sidebar-accent": "oklch(0.1928 0.0331 242.5459)", + "sidebar-accent-foreground": "oklch(0.6692 0.1607 245.0110)", + "sidebar-border": "oklch(0.3795 0.0220 240.5943)", + "sidebar-ring": "oklch(0.6818 0.1584 243.3540)", + }, + fonts: { + sans: "Open Sans, sans-serif", + serif: "Georgia, serif", + mono: "Menlo, monospace", + }, + fontSources: { + googleFonts: ["Open Sans"], + }, + tokens: { + radius: "1.3rem", + spacing: "0.25rem", + trackingNormal: "0em", + shadowColor: "rgba(29,161,242,0.15)", + shadowOpacity: "0", + shadowBlur: "0px", + shadowSpread: "0px", + shadowOffsetX: "0px", + shadowOffsetY: "2px", + }, + shadows: { + light: { + "2xs": "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00)", + xs: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00)", + sm: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + default: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + md: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 2px 4px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + lg: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 4px 6px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + xl: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 8px 10px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + "2xl": "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00)", + }, + dark: { + "2xs": "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00)", + xs: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00)", + sm: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + default: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + md: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 2px 4px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + lg: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 4px 6px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + xl: "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 8px 10px -1px hsl(202.8169 89.1213% 53.1373% / 0.00)", + "2xl": "0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00)", + }, + }, + isPreset: true, + previewColors: { + primary: "oklch(0.6723 0.1606 244.9955)", + background: "oklch(1.0000 0 0)", + foreground: "oklch(0.1884 0.0128 248.5103)", + }, + }, + + { + id: "orang", + name: "Orang", + description: "Vibrant orange with warm, earthy undertones", + light: { + "background": "oklch(0.9856 0.0084 56.3169)", + "foreground": "oklch(0.3353 0.0132 2.7676)", + "card": "oklch(1.0000 0 0)", + "card-foreground": "oklch(0.3353 0.0132 2.7676)", + "popover": "oklch(1.0000 0 0)", + "popover-foreground": "oklch(0.3353 0.0132 2.7676)", + "primary": "oklch(0.7357 0.1641 34.7091)", + "primary-foreground": "oklch(1.0000 0 0)", + "secondary": "oklch(0.9596 0.0200 28.9029)", + "secondary-foreground": "oklch(0.5587 0.1294 32.7364)", + "muted": "oklch(0.9656 0.0176 39.4009)", + "muted-foreground": "oklch(0.5534 0.0116 58.0708)", + "accent": "oklch(0.8278 0.1131 57.9984)", + "accent-foreground": "oklch(0.3353 0.0132 2.7676)", + "destructive": "oklch(0.6122 0.2082 22.2410)", + "destructive-foreground": "oklch(1.0000 0 0)", + "border": "oklch(0.9296 0.0370 38.6868)", + "input": "oklch(0.9296 0.0370 38.6868)", + "ring": "oklch(0.7357 0.1641 34.7091)", + "chart-1": "oklch(0.7357 0.1641 34.7091)", + "chart-2": "oklch(0.8278 0.1131 57.9984)", + "chart-3": "oklch(0.8773 0.0763 54.9314)", + "chart-4": "oklch(0.8200 0.1054 40.8859)", + "chart-5": "oklch(0.6368 0.1306 32.0721)", + "sidebar": "oklch(0.9656 0.0176 39.4009)", + "sidebar-foreground": "oklch(0.3353 0.0132 2.7676)", + "sidebar-primary": "oklch(0.7357 0.1641 34.7091)", + "sidebar-primary-foreground": "oklch(1.0000 0 0)", + "sidebar-accent": "oklch(0.8278 0.1131 57.9984)", + "sidebar-accent-foreground": "oklch(0.3353 0.0132 2.7676)", + "sidebar-border": "oklch(0.9296 0.0370 38.6868)", + "sidebar-ring": "oklch(0.7357 0.1641 34.7091)", + }, + dark: { + "background": "oklch(0.2569 0.0169 352.4042)", + "foreground": "oklch(0.9397 0.0119 51.3156)", + "card": "oklch(0.3184 0.0176 341.4465)", + "card-foreground": "oklch(0.9397 0.0119 51.3156)", + "popover": "oklch(0.3184 0.0176 341.4465)", + "popover-foreground": "oklch(0.9397 0.0119 51.3156)", + "primary": "oklch(0.7357 0.1641 34.7091)", + "primary-foreground": "oklch(1.0000 0 0)", + "secondary": "oklch(0.3637 0.0203 342.2664)", + "secondary-foreground": "oklch(0.9397 0.0119 51.3156)", + "muted": "oklch(0.2848 0.0159 343.6554)", + "muted-foreground": "oklch(0.8378 0.0237 52.6346)", + "accent": "oklch(0.8278 0.1131 57.9984)", + "accent-foreground": "oklch(0.2569 0.0169 352.4042)", + "destructive": "oklch(0.6122 0.2082 22.2410)", + "destructive-foreground": "oklch(1.0000 0 0)", + "border": "oklch(0.3637 0.0203 342.2664)", + "input": "oklch(0.3637 0.0203 342.2664)", + "ring": "oklch(0.7357 0.1641 34.7091)", + "chart-1": "oklch(0.7357 0.1641 34.7091)", + "chart-2": "oklch(0.8278 0.1131 57.9984)", + "chart-3": "oklch(0.8773 0.0763 54.9314)", + "chart-4": "oklch(0.8200 0.1054 40.8859)", + "chart-5": "oklch(0.6368 0.1306 32.0721)", + "sidebar": "oklch(0.2569 0.0169 352.4042)", + "sidebar-foreground": "oklch(0.9397 0.0119 51.3156)", + "sidebar-primary": "oklch(0.7357 0.1641 34.7091)", + "sidebar-primary-foreground": "oklch(1.0000 0 0)", + "sidebar-accent": "oklch(0.8278 0.1131 57.9984)", + "sidebar-accent-foreground": "oklch(0.2569 0.0169 352.4042)", + "sidebar-border": "oklch(0.3637 0.0203 342.2664)", + "sidebar-ring": "oklch(0.7357 0.1641 34.7091)", + }, + fonts: { + sans: "Montserrat, sans-serif", + serif: "Merriweather, serif", + mono: "Ubuntu Mono, monospace", + }, + fontSources: { + googleFonts: ["Montserrat", "Merriweather", "Ubuntu Mono"], + }, + tokens: { + radius: "0.625rem", + spacing: "0.25rem", + trackingNormal: "0em", + shadowColor: "hsl(0 0% 0%)", + shadowOpacity: "0.09", + shadowBlur: "12px", + shadowSpread: "-3px", + shadowOffsetX: "0px", + shadowOffsetY: "6px", + }, + shadows: { + light: { + "2xs": "0px 6px 12px -3px hsl(0 0% 0% / 0.04)", + xs: "0px 6px 12px -3px hsl(0 0% 0% / 0.04)", + sm: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 1px 2px -4px hsl(0 0% 0% / 0.09)", + default: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 1px 2px -4px hsl(0 0% 0% / 0.09)", + md: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 2px 4px -4px hsl(0 0% 0% / 0.09)", + lg: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 4px 6px -4px hsl(0 0% 0% / 0.09)", + xl: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 8px 10px -4px hsl(0 0% 0% / 0.09)", + "2xl": "0px 6px 12px -3px hsl(0 0% 0% / 0.22)", + }, + dark: { + "2xs": "0px 6px 12px -3px hsl(0 0% 0% / 0.04)", + xs: "0px 6px 12px -3px hsl(0 0% 0% / 0.04)", + sm: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 1px 2px -4px hsl(0 0% 0% / 0.09)", + default: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 1px 2px -4px hsl(0 0% 0% / 0.09)", + md: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 2px 4px -4px hsl(0 0% 0% / 0.09)", + lg: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 4px 6px -4px hsl(0 0% 0% / 0.09)", + xl: "0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 8px 10px -4px hsl(0 0% 0% / 0.09)", + "2xl": "0px 6px 12px -3px hsl(0 0% 0% / 0.22)", + }, + }, + isPreset: true, + previewColors: { + primary: "oklch(0.7357 0.1641 34.7091)", + background: "oklch(0.9856 0.0084 56.3169)", + foreground: "oklch(0.3353 0.0132 2.7676)", + }, + }, + + { + id: "catppuccin", + name: "Catppuccin", + description: "Pastel purple and teal inspired by Catppuccin Mocha", + light: { + "background": "oklch(0.9578 0.0058 264.5321)", + "foreground": "oklch(0.4355 0.0430 279.3250)", + "card": "oklch(1.0000 0 0)", + "card-foreground": "oklch(0.4355 0.0430 279.3250)", + "popover": "oklch(0.8575 0.0145 268.4756)", + "popover-foreground": "oklch(0.4355 0.0430 279.3250)", + "primary": "oklch(0.5547 0.2503 297.0156)", + "primary-foreground": "oklch(1.0000 0 0)", + "secondary": "oklch(0.8575 0.0145 268.4756)", + "secondary-foreground": "oklch(0.4355 0.0430 279.3250)", + "muted": "oklch(0.9060 0.0117 264.5071)", + "muted-foreground": "oklch(0.5471 0.0343 279.0837)", + "accent": "oklch(0.6820 0.1448 235.3822)", + "accent-foreground": "oklch(1.0000 0 0)", + "destructive": "oklch(0.5505 0.2155 19.8095)", + "destructive-foreground": "oklch(1.0000 0 0)", + "border": "oklch(0.8083 0.0174 271.1982)", + "input": "oklch(0.8575 0.0145 268.4756)", + "ring": "oklch(0.5547 0.2503 297.0156)", + "chart-1": "oklch(0.5547 0.2503 297.0156)", + "chart-2": "oklch(0.6820 0.1448 235.3822)", + "chart-3": "oklch(0.6250 0.1772 140.4448)", + "chart-4": "oklch(0.6920 0.2041 42.4293)", + "chart-5": "oklch(0.7141 0.1045 33.0967)", + "sidebar": "oklch(0.9335 0.0087 264.5206)", + "sidebar-foreground": "oklch(0.4355 0.0430 279.3250)", + "sidebar-primary": "oklch(0.5547 0.2503 297.0156)", + "sidebar-primary-foreground": "oklch(1.0000 0 0)", + "sidebar-accent": "oklch(0.6820 0.1448 235.3822)", + "sidebar-accent-foreground": "oklch(1.0000 0 0)", + "sidebar-border": "oklch(0.8083 0.0174 271.1982)", + "sidebar-ring": "oklch(0.5547 0.2503 297.0156)", + }, + dark: { + "background": "oklch(0.2155 0.0254 284.0647)", + "foreground": "oklch(0.8787 0.0426 272.2767)", + "card": "oklch(0.2429 0.0304 283.9110)", + "card-foreground": "oklch(0.8787 0.0426 272.2767)", + "popover": "oklch(0.4037 0.0320 280.1520)", + "popover-foreground": "oklch(0.8787 0.0426 272.2767)", + "primary": "oklch(0.7871 0.1187 304.7693)", + "primary-foreground": "oklch(0.2429 0.0304 283.9110)", + "secondary": "oklch(0.4765 0.0340 278.6430)", + "secondary-foreground": "oklch(0.8787 0.0426 272.2767)", + "muted": "oklch(0.2973 0.0294 276.2144)", + "muted-foreground": "oklch(0.7510 0.0396 273.9320)", + "accent": "oklch(0.8467 0.0833 210.2545)", + "accent-foreground": "oklch(0.2429 0.0304 283.9110)", + "destructive": "oklch(0.7556 0.1297 2.7642)", + "destructive-foreground": "oklch(0.2429 0.0304 283.9110)", + "border": "oklch(0.3240 0.0319 281.9784)", + "input": "oklch(0.3240 0.0319 281.9784)", + "ring": "oklch(0.7871 0.1187 304.7693)", + "chart-1": "oklch(0.7871 0.1187 304.7693)", + "chart-2": "oklch(0.8467 0.0833 210.2545)", + "chart-3": "oklch(0.8577 0.1092 142.7153)", + "chart-4": "oklch(0.8237 0.1015 52.6294)", + "chart-5": "oklch(0.9226 0.0238 30.4919)", + "sidebar": "oklch(0.1828 0.0204 284.2039)", + "sidebar-foreground": "oklch(0.8787 0.0426 272.2767)", + "sidebar-primary": "oklch(0.7871 0.1187 304.7693)", + "sidebar-primary-foreground": "oklch(0.2429 0.0304 283.9110)", + "sidebar-accent": "oklch(0.8467 0.0833 210.2545)", + "sidebar-accent-foreground": "oklch(0.2429 0.0304 283.9110)", + "sidebar-border": "oklch(0.4037 0.0320 280.1520)", + "sidebar-ring": "oklch(0.7871 0.1187 304.7693)", + }, + fonts: { + sans: "Montserrat, sans-serif", + serif: "Georgia, serif", + mono: "Fira Code, monospace", + }, + fontSources: { + googleFonts: ["Montserrat", "Fira Code"], + }, + tokens: { + radius: "0.35rem", + spacing: "0.25rem", + trackingNormal: "0em", + shadowColor: "hsl(240 30% 25%)", + shadowOpacity: "0.12", + shadowBlur: "6px", + shadowSpread: "0px", + shadowOffsetX: "0px", + shadowOffsetY: "4px", + }, + shadows: { + light: { + "2xs": "0px 4px 6px 0px hsl(240 30% 25% / 0.06)", + xs: "0px 4px 6px 0px hsl(240 30% 25% / 0.06)", + sm: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12)", + default: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12)", + md: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 2px 4px -1px hsl(240 30% 25% / 0.12)", + lg: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 4px 6px -1px hsl(240 30% 25% / 0.12)", + xl: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 8px 10px -1px hsl(240 30% 25% / 0.12)", + "2xl": "0px 4px 6px 0px hsl(240 30% 25% / 0.30)", + }, + dark: { + "2xs": "0px 4px 6px 0px hsl(240 30% 25% / 0.06)", + xs: "0px 4px 6px 0px hsl(240 30% 25% / 0.06)", + sm: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12)", + default: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12)", + md: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 2px 4px -1px hsl(240 30% 25% / 0.12)", + lg: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 4px 6px -1px hsl(240 30% 25% / 0.12)", + xl: "0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 8px 10px -1px hsl(240 30% 25% / 0.12)", + "2xl": "0px 4px 6px 0px hsl(240 30% 25% / 0.30)", + }, + }, + isPreset: true, + previewColors: { + primary: "oklch(0.5547 0.2503 297.0156)", + background: "oklch(0.9578 0.0058 264.5321)", + foreground: "oklch(0.4355 0.0430 279.3250)", + }, + }, ] export function findPreset(