Add theme selection, dark/light mode selection
This commit is contained in:
160
public/themes/amber.css
Normal file
160
public/themes/amber.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(1.0000 0 0);
|
||||
--foreground: oklch(0.2686 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.2686 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.2686 0 0);
|
||||
--primary: oklch(0.7686 0.1647 70.0804);
|
||||
--primary-foreground: oklch(0 0 0);
|
||||
--secondary: oklch(0.9670 0.0029 264.5419);
|
||||
--secondary-foreground: oklch(0.4461 0.0263 256.8018);
|
||||
--muted: oklch(0.9846 0.0017 247.8389);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.9869 0.0214 95.2774);
|
||||
--accent-foreground: oklch(0.4732 0.1247 46.2007);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9276 0.0058 264.5313);
|
||||
--input: oklch(0.9276 0.0058 264.5313);
|
||||
--ring: oklch(0.7686 0.1647 70.0804);
|
||||
--chart-1: oklch(0.7686 0.1647 70.0804);
|
||||
--chart-2: oklch(0.6658 0.1574 58.3183);
|
||||
--chart-3: oklch(0.5553 0.1455 48.9975);
|
||||
--chart-4: oklch(0.4732 0.1247 46.2007);
|
||||
--chart-5: oklch(0.4137 0.1054 45.9038);
|
||||
--sidebar: oklch(0.9846 0.0017 247.8389);
|
||||
--sidebar-foreground: oklch(0.2686 0 0);
|
||||
--sidebar-primary: oklch(0.7686 0.1647 70.0804);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9869 0.0214 95.2774);
|
||||
--sidebar-accent-foreground: oklch(0.4732 0.1247 46.2007);
|
||||
--sidebar-border: oklch(0.9276 0.0058 264.5313);
|
||||
--sidebar-ring: oklch(0.7686 0.1647 70.0804);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.375rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 8px;
|
||||
--shadow-spread: -1px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 2px 4px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 4px 6px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 8px 10px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2046 0 0);
|
||||
--foreground: oklch(0.9219 0 0);
|
||||
--card: oklch(0.2686 0 0);
|
||||
--card-foreground: oklch(0.9219 0 0);
|
||||
--popover: oklch(0.2686 0 0);
|
||||
--popover-foreground: oklch(0.9219 0 0);
|
||||
--primary: oklch(0.7686 0.1647 70.0804);
|
||||
--primary-foreground: oklch(0 0 0);
|
||||
--secondary: oklch(0.2686 0 0);
|
||||
--secondary-foreground: oklch(0.9219 0 0);
|
||||
--muted: oklch(0.2393 0 0);
|
||||
--muted-foreground: oklch(0.7155 0 0);
|
||||
--accent: oklch(0.4732 0.1247 46.2007);
|
||||
--accent-foreground: oklch(0.9243 0.1151 95.7459);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3715 0 0);
|
||||
--input: oklch(0.3715 0 0);
|
||||
--ring: oklch(0.7686 0.1647 70.0804);
|
||||
--chart-1: oklch(0.8369 0.1644 84.4286);
|
||||
--chart-2: oklch(0.6658 0.1574 58.3183);
|
||||
--chart-3: oklch(0.4732 0.1247 46.2007);
|
||||
--chart-4: oklch(0.5553 0.1455 48.9975);
|
||||
--chart-5: oklch(0.4732 0.1247 46.2007);
|
||||
--sidebar: oklch(0.1684 0 0);
|
||||
--sidebar-foreground: oklch(0.9219 0 0);
|
||||
--sidebar-primary: oklch(0.7686 0.1647 70.0804);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.4732 0.1247 46.2007);
|
||||
--sidebar-accent-foreground: oklch(0.9243 0.1151 95.7459);
|
||||
--sidebar-border: oklch(0.3715 0 0);
|
||||
--sidebar-ring: oklch(0.7686 0.1647 70.0804);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.375rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 8px;
|
||||
--shadow-spread: -1px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 2px 4px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 4px 6px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 8px 10px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/amethyst.css
Normal file
160
public/themes/amethyst.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9777 0.0041 301.4256);
|
||||
--foreground: oklch(0.3651 0.0325 287.0807);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3651 0.0325 287.0807);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3651 0.0325 287.0807);
|
||||
--primary: oklch(0.6104 0.0767 299.7335);
|
||||
--primary-foreground: oklch(0.9777 0.0041 301.4256);
|
||||
--secondary: oklch(0.8957 0.0265 300.2416);
|
||||
--secondary-foreground: oklch(0.3651 0.0325 287.0807);
|
||||
--muted: oklch(0.8906 0.0139 299.7754);
|
||||
--muted-foreground: oklch(0.5288 0.0375 290.7895);
|
||||
--accent: oklch(0.7889 0.0802 359.9375);
|
||||
--accent-foreground: oklch(0.3394 0.0441 1.7583);
|
||||
--destructive: oklch(0.6332 0.1578 22.6734);
|
||||
--destructive-foreground: oklch(0.9777 0.0041 301.4256);
|
||||
--border: oklch(0.8447 0.0226 300.1421);
|
||||
--input: oklch(0.9329 0.0124 301.2783);
|
||||
--ring: oklch(0.6104 0.0767 299.7335);
|
||||
--chart-1: oklch(0.6104 0.0767 299.7335);
|
||||
--chart-2: oklch(0.7889 0.0802 359.9375);
|
||||
--chart-3: oklch(0.7321 0.0749 169.8670);
|
||||
--chart-4: oklch(0.8540 0.0882 76.8292);
|
||||
--chart-5: oklch(0.7857 0.0645 258.0839);
|
||||
--sidebar: oklch(0.9554 0.0082 301.3541);
|
||||
--sidebar-foreground: oklch(0.3651 0.0325 287.0807);
|
||||
--sidebar-primary: oklch(0.6104 0.0767 299.7335);
|
||||
--sidebar-primary-foreground: oklch(0.9777 0.0041 301.4256);
|
||||
--sidebar-accent: oklch(0.7889 0.0802 359.9375);
|
||||
--sidebar-accent-foreground: oklch(0.3394 0.0441 1.7583);
|
||||
--sidebar-border: oklch(0.8719 0.0198 302.1690);
|
||||
--sidebar-ring: oklch(0.6104 0.0767 299.7335);
|
||||
--font-sans: Geist, sans-serif;
|
||||
--font-serif: "Lora", Georgia, serif;
|
||||
--font-mono: "Fira Code", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 5px;
|
||||
--shadow-spread: 1px;
|
||||
--shadow-opacity: 0.06;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 1px 2px 5px 1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-xs: 1px 2px 5px 1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-sm: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 1px 2px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 1px 2px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow-md: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 2px 4px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow-lg: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 4px 6px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow-xl: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 8px 10px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow-2xl: 1px 2px 5px 1px hsl(0 0% 0% / 0.15);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2166 0.0215 292.8474);
|
||||
--foreground: oklch(0.9053 0.0245 293.5570);
|
||||
--card: oklch(0.2544 0.0301 292.7315);
|
||||
--card-foreground: oklch(0.9053 0.0245 293.5570);
|
||||
--popover: oklch(0.2544 0.0301 292.7315);
|
||||
--popover-foreground: oklch(0.9053 0.0245 293.5570);
|
||||
--primary: oklch(0.7058 0.0777 302.0489);
|
||||
--primary-foreground: oklch(0.2166 0.0215 292.8474);
|
||||
--secondary: oklch(0.4604 0.0472 295.5578);
|
||||
--secondary-foreground: oklch(0.9053 0.0245 293.5570);
|
||||
--muted: oklch(0.2560 0.0320 294.8380);
|
||||
--muted-foreground: oklch(0.6974 0.0282 300.0614);
|
||||
--accent: oklch(0.3181 0.0321 308.6149);
|
||||
--accent-foreground: oklch(0.8391 0.0692 2.6681);
|
||||
--destructive: oklch(0.6875 0.1420 21.4566);
|
||||
--destructive-foreground: oklch(0.2166 0.0215 292.8474);
|
||||
--border: oklch(0.3063 0.0359 293.3367);
|
||||
--input: oklch(0.2847 0.0346 291.2726);
|
||||
--ring: oklch(0.7058 0.0777 302.0489);
|
||||
--chart-1: oklch(0.7058 0.0777 302.0489);
|
||||
--chart-2: oklch(0.8391 0.0692 2.6681);
|
||||
--chart-3: oklch(0.7321 0.0749 169.8670);
|
||||
--chart-4: oklch(0.8540 0.0882 76.8292);
|
||||
--chart-5: oklch(0.7857 0.0645 258.0839);
|
||||
--sidebar: oklch(0.1985 0.0200 293.6639);
|
||||
--sidebar-foreground: oklch(0.9053 0.0245 293.5570);
|
||||
--sidebar-primary: oklch(0.7058 0.0777 302.0489);
|
||||
--sidebar-primary-foreground: oklch(0.2166 0.0215 292.8474);
|
||||
--sidebar-accent: oklch(0.3181 0.0321 308.6149);
|
||||
--sidebar-accent-foreground: oklch(0.8391 0.0692 2.6681);
|
||||
--sidebar-border: oklch(0.2847 0.0346 291.2726);
|
||||
--sidebar-ring: oklch(0.7058 0.0777 302.0489);
|
||||
--font-sans: Geist, sans-serif;
|
||||
--font-serif: "Lora", Georgia, serif;
|
||||
--font-mono: "Fira Code", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 5px;
|
||||
--shadow-spread: 1px;
|
||||
--shadow-opacity: 0.06;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 1px 2px 5px 1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-xs: 1px 2px 5px 1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-sm: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 1px 2px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 1px 2px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow-md: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 2px 4px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow-lg: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 4px 6px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow-xl: 1px 2px 5px 1px hsl(0 0% 0% / 0.06), 1px 8px 10px 0px hsl(0 0% 0% / 0.06);
|
||||
--shadow-2xl: 1px 2px 5px 1px hsl(0 0% 0% / 0.15);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/bold-tech.css
Normal file
160
public/themes/bold-tech.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(1.0000 0 0);
|
||||
--foreground: oklch(0.3588 0.1354 278.6973);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3588 0.1354 278.6973);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3588 0.1354 278.6973);
|
||||
--primary: oklch(0.6056 0.2189 292.7172);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9618 0.0202 295.1913);
|
||||
--secondary-foreground: oklch(0.4568 0.2146 277.0229);
|
||||
--muted: oklch(0.9691 0.0161 293.7558);
|
||||
--muted-foreground: oklch(0.5413 0.2466 293.0090);
|
||||
--accent: oklch(0.9319 0.0316 255.5855);
|
||||
--accent-foreground: oklch(0.4244 0.1809 265.6377);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9299 0.0334 272.7879);
|
||||
--input: oklch(0.9299 0.0334 272.7879);
|
||||
--ring: oklch(0.6056 0.2189 292.7172);
|
||||
--chart-1: oklch(0.6056 0.2189 292.7172);
|
||||
--chart-2: oklch(0.5413 0.2466 293.0090);
|
||||
--chart-3: oklch(0.4907 0.2412 292.5809);
|
||||
--chart-4: oklch(0.4320 0.2106 292.7591);
|
||||
--chart-5: oklch(0.3796 0.1783 293.7446);
|
||||
--sidebar: oklch(0.9691 0.0161 293.7558);
|
||||
--sidebar-foreground: oklch(0.3588 0.1354 278.6973);
|
||||
--sidebar-primary: oklch(0.6056 0.2189 292.7172);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9319 0.0316 255.5855);
|
||||
--sidebar-accent-foreground: oklch(0.4244 0.1809 265.6377);
|
||||
--sidebar-border: oklch(0.9299 0.0334 272.7879);
|
||||
--sidebar-ring: oklch(0.6056 0.2189 292.7172);
|
||||
--font-sans: Roboto, sans-serif;
|
||||
--font-serif: Playfair Display, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.625rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 4px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.2;
|
||||
--shadow-color: hsl(255 86% 66%);
|
||||
--shadow-2xs: 2px 2px 4px 0px hsl(255 86% 66% / 0.10);
|
||||
--shadow-xs: 2px 2px 4px 0px hsl(255 86% 66% / 0.10);
|
||||
--shadow-sm: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 1px 2px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 1px 2px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow-md: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 2px 4px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow-lg: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 4px 6px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow-xl: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 8px 10px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow-2xl: 2px 2px 4px 0px hsl(255 86% 66% / 0.50);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2077 0.0398 265.7549);
|
||||
--foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--card: oklch(0.2573 0.0861 281.2883);
|
||||
--card-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--popover: oklch(0.2573 0.0861 281.2883);
|
||||
--popover-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--primary: oklch(0.6056 0.2189 292.7172);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.2573 0.0861 281.2883);
|
||||
--secondary-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--muted: oklch(0.2329 0.0919 279.1398);
|
||||
--muted-foreground: oklch(0.8112 0.1013 293.5712);
|
||||
--accent: oklch(0.4568 0.2146 277.0229);
|
||||
--accent-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.2827 0.1351 291.0894);
|
||||
--input: oklch(0.2827 0.1351 291.0894);
|
||||
--ring: oklch(0.6056 0.2189 292.7172);
|
||||
--chart-1: oklch(0.7090 0.1592 293.5412);
|
||||
--chart-2: oklch(0.6056 0.2189 292.7172);
|
||||
--chart-3: oklch(0.5413 0.2466 293.0090);
|
||||
--chart-4: oklch(0.4907 0.2412 292.5809);
|
||||
--chart-5: oklch(0.4320 0.2106 292.7591);
|
||||
--sidebar: oklch(0.2077 0.0398 265.7549);
|
||||
--sidebar-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--sidebar-primary: oklch(0.6056 0.2189 292.7172);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.4568 0.2146 277.0229);
|
||||
--sidebar-accent-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--sidebar-border: oklch(0.2827 0.1351 291.0894);
|
||||
--sidebar-ring: oklch(0.6056 0.2189 292.7172);
|
||||
--font-sans: Roboto, sans-serif;
|
||||
--font-serif: Playfair Display, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.625rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 4px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.2;
|
||||
--shadow-color: hsl(255 86% 66%);
|
||||
--shadow-2xs: 2px 2px 4px 0px hsl(255 86% 66% / 0.10);
|
||||
--shadow-xs: 2px 2px 4px 0px hsl(255 86% 66% / 0.10);
|
||||
--shadow-sm: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 1px 2px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 1px 2px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow-md: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 2px 4px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow-lg: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 4px 6px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow-xl: 2px 2px 4px 0px hsl(255 86% 66% / 0.20), 2px 8px 10px -1px hsl(255 86% 66% / 0.20);
|
||||
--shadow-2xl: 2px 2px 4px 0px hsl(255 86% 66% / 0.50);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/bubblegum.css
Normal file
160
public/themes/bubblegum.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9399 0.0203 345.6985);
|
||||
--foreground: oklch(0.4712 0 0);
|
||||
--card: oklch(0.9498 0.0500 86.8891);
|
||||
--card-foreground: oklch(0.4712 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.4712 0 0);
|
||||
--primary: oklch(0.6209 0.1801 348.1385);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.8095 0.0694 198.1863);
|
||||
--secondary-foreground: oklch(0.3211 0 0);
|
||||
--muted: oklch(0.8800 0.0504 212.0952);
|
||||
--muted-foreground: oklch(0.5795 0 0);
|
||||
--accent: oklch(0.9195 0.0801 87.6670);
|
||||
--accent-foreground: oklch(0.3211 0 0);
|
||||
--destructive: oklch(0.7091 0.1697 21.9551);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.6209 0.1801 348.1385);
|
||||
--input: oklch(0.9189 0 0);
|
||||
--ring: oklch(0.7002 0.1597 350.7532);
|
||||
--chart-1: oklch(0.7002 0.1597 350.7532);
|
||||
--chart-2: oklch(0.8189 0.0799 212.0892);
|
||||
--chart-3: oklch(0.9195 0.0801 87.6670);
|
||||
--chart-4: oklch(0.7998 0.1110 348.1791);
|
||||
--chart-5: oklch(0.6197 0.1899 353.9091);
|
||||
--sidebar: oklch(0.9140 0.0424 343.0913);
|
||||
--sidebar-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-primary: oklch(0.6559 0.2118 354.3084);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8228 0.1095 346.0184);
|
||||
--sidebar-accent-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-border: oklch(0.9464 0.0327 307.1745);
|
||||
--sidebar-ring: oklch(0.6559 0.2118 354.3084);
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.4rem;
|
||||
--shadow-x: 3px;
|
||||
--shadow-y: 3px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 1.0;
|
||||
--shadow-color: hsl(325.78 58.18% 56.86% / 0.5);
|
||||
--shadow-2xs: 3px 3px 0px 0px hsl(325.7800 58.1800% 56.8600% / 0.50);
|
||||
--shadow-xs: 3px 3px 0px 0px hsl(325.7800 58.1800% 56.8600% / 0.50);
|
||||
--shadow-sm: 3px 3px 0px 0px hsl(325.7800 58.1800% 56.8600% / 1.00), 3px 1px 2px -1px hsl(325.7800 58.1800% 56.8600% / 1.00);
|
||||
--shadow: 3px 3px 0px 0px hsl(325.7800 58.1800% 56.8600% / 1.00), 3px 1px 2px -1px hsl(325.7800 58.1800% 56.8600% / 1.00);
|
||||
--shadow-md: 3px 3px 0px 0px hsl(325.7800 58.1800% 56.8600% / 1.00), 3px 2px 4px -1px hsl(325.7800 58.1800% 56.8600% / 1.00);
|
||||
--shadow-lg: 3px 3px 0px 0px hsl(325.7800 58.1800% 56.8600% / 1.00), 3px 4px 6px -1px hsl(325.7800 58.1800% 56.8600% / 1.00);
|
||||
--shadow-xl: 3px 3px 0px 0px hsl(325.7800 58.1800% 56.8600% / 1.00), 3px 8px 10px -1px hsl(325.7800 58.1800% 56.8600% / 1.00);
|
||||
--shadow-2xl: 3px 3px 0px 0px hsl(325.7800 58.1800% 56.8600% / 2.50);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2497 0.0305 234.1628);
|
||||
--foreground: oklch(0.9306 0.0197 349.0785);
|
||||
--card: oklch(0.2902 0.0299 233.5352);
|
||||
--card-foreground: oklch(0.9306 0.0197 349.0785);
|
||||
--popover: oklch(0.2902 0.0299 233.5352);
|
||||
--popover-foreground: oklch(0.9306 0.0197 349.0785);
|
||||
--primary: oklch(0.9195 0.0801 87.6670);
|
||||
--primary-foreground: oklch(0.2497 0.0305 234.1628);
|
||||
--secondary: oklch(0.7794 0.0803 4.1330);
|
||||
--secondary-foreground: oklch(0.2497 0.0305 234.1628);
|
||||
--muted: oklch(0.2713 0.0086 255.5780);
|
||||
--muted-foreground: oklch(0.7794 0.0803 4.1330);
|
||||
--accent: oklch(0.6699 0.0988 356.9762);
|
||||
--accent-foreground: oklch(0.9306 0.0197 349.0785);
|
||||
--destructive: oklch(0.6702 0.1806 350.3599);
|
||||
--destructive-foreground: oklch(0.2497 0.0305 234.1628);
|
||||
--border: oklch(0.3907 0.0399 242.2181);
|
||||
--input: oklch(0.3093 0.0305 232.0027);
|
||||
--ring: oklch(0.6998 0.0896 201.8672);
|
||||
--chart-1: oklch(0.6998 0.0896 201.8672);
|
||||
--chart-2: oklch(0.7794 0.0803 4.1330);
|
||||
--chart-3: oklch(0.6699 0.0988 356.9762);
|
||||
--chart-4: oklch(0.4408 0.0702 217.0848);
|
||||
--chart-5: oklch(0.2713 0.0086 255.5780);
|
||||
--sidebar: oklch(0.2303 0.0270 235.9743);
|
||||
--sidebar-foreground: oklch(0.9670 0.0029 264.5419);
|
||||
--sidebar-primary: oklch(0.6559 0.2118 354.3084);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8228 0.1095 346.0184);
|
||||
--sidebar-accent-foreground: oklch(0.2781 0.0296 256.8480);
|
||||
--sidebar-border: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-ring: oklch(0.6559 0.2118 354.3084);
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.4rem;
|
||||
--shadow-x: 3px;
|
||||
--shadow-y: 3px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 1.0;
|
||||
--shadow-color: #324859;
|
||||
--shadow-2xs: 3px 3px 0px 0px hsl(206.1538 28.0576% 27.2549% / 0.50);
|
||||
--shadow-xs: 3px 3px 0px 0px hsl(206.1538 28.0576% 27.2549% / 0.50);
|
||||
--shadow-sm: 3px 3px 0px 0px hsl(206.1538 28.0576% 27.2549% / 1.00), 3px 1px 2px -1px hsl(206.1538 28.0576% 27.2549% / 1.00);
|
||||
--shadow: 3px 3px 0px 0px hsl(206.1538 28.0576% 27.2549% / 1.00), 3px 1px 2px -1px hsl(206.1538 28.0576% 27.2549% / 1.00);
|
||||
--shadow-md: 3px 3px 0px 0px hsl(206.1538 28.0576% 27.2549% / 1.00), 3px 2px 4px -1px hsl(206.1538 28.0576% 27.2549% / 1.00);
|
||||
--shadow-lg: 3px 3px 0px 0px hsl(206.1538 28.0576% 27.2549% / 1.00), 3px 4px 6px -1px hsl(206.1538 28.0576% 27.2549% / 1.00);
|
||||
--shadow-xl: 3px 3px 0px 0px hsl(206.1538 28.0576% 27.2549% / 1.00), 3px 8px 10px -1px hsl(206.1538 28.0576% 27.2549% / 1.00);
|
||||
--shadow-2xl: 3px 3px 0px 0px hsl(206.1538 28.0576% 27.2549% / 2.50);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/caffeine.css
Normal file
160
public/themes/caffeine.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9821 0 0);
|
||||
--foreground: oklch(0.2435 0 0);
|
||||
--card: oklch(0.9911 0 0);
|
||||
--card-foreground: oklch(0.2435 0 0);
|
||||
--popover: oklch(0.9911 0 0);
|
||||
--popover-foreground: oklch(0.2435 0 0);
|
||||
--primary: oklch(0.4341 0.0392 41.9938);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9200 0.0651 74.3695);
|
||||
--secondary-foreground: oklch(0.3499 0.0685 40.8288);
|
||||
--muted: oklch(0.9521 0 0);
|
||||
--muted-foreground: oklch(0.5032 0 0);
|
||||
--accent: oklch(0.9310 0 0);
|
||||
--accent-foreground: oklch(0.2435 0 0);
|
||||
--destructive: oklch(0.6271 0.1936 33.3390);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8822 0 0);
|
||||
--input: oklch(0.8822 0 0);
|
||||
--ring: oklch(0.4341 0.0392 41.9938);
|
||||
--chart-1: oklch(0.4341 0.0392 41.9938);
|
||||
--chart-2: oklch(0.9200 0.0651 74.3695);
|
||||
--chart-3: oklch(0.9310 0 0);
|
||||
--chart-4: oklch(0.9367 0.0523 75.5009);
|
||||
--chart-5: oklch(0.4338 0.0437 41.6746);
|
||||
--sidebar: oklch(0.9881 0 0);
|
||||
--sidebar-foreground: oklch(0.2645 0 0);
|
||||
--sidebar-primary: oklch(0.3250 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.9881 0 0);
|
||||
--sidebar-accent: oklch(0.9761 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.3250 0 0);
|
||||
--sidebar-border: oklch(0.9401 0 0);
|
||||
--sidebar-ring: oklch(0.7731 0 0);
|
||||
--font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1776 0 0);
|
||||
--foreground: oklch(0.9491 0 0);
|
||||
--card: oklch(0.2134 0 0);
|
||||
--card-foreground: oklch(0.9491 0 0);
|
||||
--popover: oklch(0.2134 0 0);
|
||||
--popover-foreground: oklch(0.9491 0 0);
|
||||
--primary: oklch(0.9247 0.0524 66.1732);
|
||||
--primary-foreground: oklch(0.2029 0.0240 200.1962);
|
||||
--secondary: oklch(0.3163 0.0190 63.6992);
|
||||
--secondary-foreground: oklch(0.9247 0.0524 66.1732);
|
||||
--muted: oklch(0.2520 0 0);
|
||||
--muted-foreground: oklch(0.7699 0 0);
|
||||
--accent: oklch(0.2850 0 0);
|
||||
--accent-foreground: oklch(0.9491 0 0);
|
||||
--destructive: oklch(0.6271 0.1936 33.3390);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.2351 0.0115 91.7467);
|
||||
--input: oklch(0.4017 0 0);
|
||||
--ring: oklch(0.9247 0.0524 66.1732);
|
||||
--chart-1: oklch(0.9247 0.0524 66.1732);
|
||||
--chart-2: oklch(0.3163 0.0190 63.6992);
|
||||
--chart-3: oklch(0.2850 0 0);
|
||||
--chart-4: oklch(0.3481 0.0219 67.0001);
|
||||
--chart-5: oklch(0.9245 0.0533 67.0855);
|
||||
--sidebar: oklch(0.2103 0.0059 285.8852);
|
||||
--sidebar-foreground: oklch(0.9674 0.0013 286.3752);
|
||||
--sidebar-primary: oklch(0.4882 0.2172 264.3763);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.2739 0.0055 286.0326);
|
||||
--sidebar-accent-foreground: oklch(0.9674 0.0013 286.3752);
|
||||
--sidebar-border: oklch(0.2739 0.0055 286.0326);
|
||||
--sidebar-ring: oklch(0.8711 0.0055 286.2860);
|
||||
--font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/candyland.css
Normal file
160
public/themes/candyland.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9809 0.0025 228.7836);
|
||||
--foreground: oklch(0.3211 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3211 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3211 0 0);
|
||||
--primary: oklch(0.8677 0.0735 7.0855);
|
||||
--primary-foreground: oklch(0 0 0);
|
||||
--secondary: oklch(0.8148 0.0819 225.7537);
|
||||
--secondary-foreground: oklch(0 0 0);
|
||||
--muted: oklch(0.8828 0.0285 98.1033);
|
||||
--muted-foreground: oklch(0.5382 0 0);
|
||||
--accent: oklch(0.9680 0.2110 109.7692);
|
||||
--accent-foreground: oklch(0 0 0);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8699 0 0);
|
||||
--input: oklch(0.8699 0 0);
|
||||
--ring: oklch(0.8677 0.0735 7.0855);
|
||||
--chart-1: oklch(0.8677 0.0735 7.0855);
|
||||
--chart-2: oklch(0.8148 0.0819 225.7537);
|
||||
--chart-3: oklch(0.9680 0.2110 109.7692);
|
||||
--chart-4: oklch(0.8027 0.1355 349.2347);
|
||||
--chart-5: oklch(0.7395 0.2268 142.8504);
|
||||
--sidebar: oklch(0.9809 0.0025 228.7836);
|
||||
--sidebar-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-primary: oklch(0.8677 0.0735 7.0855);
|
||||
--sidebar-primary-foreground: oklch(0 0 0);
|
||||
--sidebar-accent: oklch(0.9680 0.2110 109.7692);
|
||||
--sidebar-accent-foreground: oklch(0 0 0);
|
||||
--sidebar-border: oklch(0.8699 0 0);
|
||||
--sidebar-ring: oklch(0.8677 0.0735 7.0855);
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: Roboto Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2303 0.0125 264.2926);
|
||||
--foreground: oklch(0.9219 0 0);
|
||||
--card: oklch(0.3210 0.0078 223.6661);
|
||||
--card-foreground: oklch(0.9219 0 0);
|
||||
--popover: oklch(0.3210 0.0078 223.6661);
|
||||
--popover-foreground: oklch(0.9219 0 0);
|
||||
--primary: oklch(0.8027 0.1355 349.2347);
|
||||
--primary-foreground: oklch(0 0 0);
|
||||
--secondary: oklch(0.7395 0.2268 142.8504);
|
||||
--secondary-foreground: oklch(0 0 0);
|
||||
--muted: oklch(0.3867 0 0);
|
||||
--muted-foreground: oklch(0.7155 0 0);
|
||||
--accent: oklch(0.8148 0.0819 225.7537);
|
||||
--accent-foreground: oklch(0 0 0);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3867 0 0);
|
||||
--input: oklch(0.3867 0 0);
|
||||
--ring: oklch(0.8027 0.1355 349.2347);
|
||||
--chart-1: oklch(0.8027 0.1355 349.2347);
|
||||
--chart-2: oklch(0.7395 0.2268 142.8504);
|
||||
--chart-3: oklch(0.8148 0.0819 225.7537);
|
||||
--chart-4: oklch(0.9680 0.2110 109.7692);
|
||||
--chart-5: oklch(0.8652 0.1768 90.3816);
|
||||
--sidebar: oklch(0.2303 0.0125 264.2926);
|
||||
--sidebar-foreground: oklch(0.9219 0 0);
|
||||
--sidebar-primary: oklch(0.8027 0.1355 349.2347);
|
||||
--sidebar-primary-foreground: oklch(0 0 0);
|
||||
--sidebar-accent: oklch(0.8148 0.0819 225.7537);
|
||||
--sidebar-accent-foreground: oklch(0 0 0);
|
||||
--sidebar-border: oklch(0.3867 0 0);
|
||||
--sidebar-ring: oklch(0.8027 0.1355 349.2347);
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: Roboto Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/catpuccin.css
Normal file
160
public/themes/catpuccin.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--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);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.35rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 6px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(240 30% 25%);
|
||||
--shadow-2xs: 0px 4px 6px 0px hsl(240 30% 25% / 0.06);
|
||||
--shadow-xs: 0px 4px 6px 0px hsl(240 30% 25% / 0.06);
|
||||
--shadow-sm: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-md: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 2px 4px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-lg: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 4px 6px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-xl: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 8px 10px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-2xl: 0px 4px 6px 0px hsl(240 30% 25% / 0.30);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.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);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.35rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 6px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(240 30% 25%);
|
||||
--shadow-2xs: 0px 4px 6px 0px hsl(240 30% 25% / 0.06);
|
||||
--shadow-xs: 0px 4px 6px 0px hsl(240 30% 25% / 0.06);
|
||||
--shadow-sm: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-md: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 2px 4px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-lg: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 4px 6px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-xl: 0px 4px 6px 0px hsl(240 30% 25% / 0.12), 0px 8px 10px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-2xl: 0px 4px 6px 0px hsl(240 30% 25% / 0.30);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/claude.css
Normal file
160
public/themes/claude.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9818 0.0054 95.0986);
|
||||
--foreground: oklch(0.3438 0.0269 95.7226);
|
||||
--card: oklch(0.9818 0.0054 95.0986);
|
||||
--card-foreground: oklch(0.1908 0.0020 106.5859);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.2671 0.0196 98.9390);
|
||||
--primary: oklch(0.6171 0.1375 39.0427);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9245 0.0138 92.9892);
|
||||
--secondary-foreground: oklch(0.4334 0.0177 98.6048);
|
||||
--muted: oklch(0.9341 0.0153 90.2390);
|
||||
--muted-foreground: oklch(0.6059 0.0075 97.4233);
|
||||
--accent: oklch(0.9245 0.0138 92.9892);
|
||||
--accent-foreground: oklch(0.2671 0.0196 98.9390);
|
||||
--destructive: oklch(0.1908 0.0020 106.5859);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8847 0.0069 97.3627);
|
||||
--input: oklch(0.7621 0.0156 98.3528);
|
||||
--ring: oklch(0.6171 0.1375 39.0427);
|
||||
--chart-1: oklch(0.5583 0.1276 42.9956);
|
||||
--chart-2: oklch(0.6898 0.1581 290.4107);
|
||||
--chart-3: oklch(0.8816 0.0276 93.1280);
|
||||
--chart-4: oklch(0.8822 0.0403 298.1792);
|
||||
--chart-5: oklch(0.5608 0.1348 42.0584);
|
||||
--sidebar: oklch(0.9663 0.0080 98.8792);
|
||||
--sidebar-foreground: oklch(0.3590 0.0051 106.6524);
|
||||
--sidebar-primary: oklch(0.6171 0.1375 39.0427);
|
||||
--sidebar-primary-foreground: oklch(0.9881 0 0);
|
||||
--sidebar-accent: oklch(0.9245 0.0138 92.9892);
|
||||
--sidebar-accent-foreground: oklch(0.3250 0 0);
|
||||
--sidebar-border: oklch(0.9401 0 0);
|
||||
--sidebar-ring: oklch(0.7731 0 0);
|
||||
--font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2679 0.0036 106.6427);
|
||||
--foreground: oklch(0.8074 0.0142 93.0137);
|
||||
--card: oklch(0.2679 0.0036 106.6427);
|
||||
--card-foreground: oklch(0.9818 0.0054 95.0986);
|
||||
--popover: oklch(0.3085 0.0035 106.6039);
|
||||
--popover-foreground: oklch(0.9211 0.0040 106.4781);
|
||||
--primary: oklch(0.6724 0.1308 38.7559);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9818 0.0054 95.0986);
|
||||
--secondary-foreground: oklch(0.3085 0.0035 106.6039);
|
||||
--muted: oklch(0.2213 0.0038 106.7070);
|
||||
--muted-foreground: oklch(0.7713 0.0169 99.0657);
|
||||
--accent: oklch(0.2130 0.0078 95.4245);
|
||||
--accent-foreground: oklch(0.9663 0.0080 98.8792);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3618 0.0101 106.8928);
|
||||
--input: oklch(0.4336 0.0113 100.2195);
|
||||
--ring: oklch(0.6724 0.1308 38.7559);
|
||||
--chart-1: oklch(0.5583 0.1276 42.9956);
|
||||
--chart-2: oklch(0.6898 0.1581 290.4107);
|
||||
--chart-3: oklch(0.2130 0.0078 95.4245);
|
||||
--chart-4: oklch(0.3074 0.0516 289.3230);
|
||||
--chart-5: oklch(0.5608 0.1348 42.0584);
|
||||
--sidebar: oklch(0.2357 0.0024 67.7077);
|
||||
--sidebar-foreground: oklch(0.8074 0.0142 93.0137);
|
||||
--sidebar-primary: oklch(0.3250 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.9881 0 0);
|
||||
--sidebar-accent: oklch(0.1680 0.0020 106.6177);
|
||||
--sidebar-accent-foreground: oklch(0.8074 0.0142 93.0137);
|
||||
--sidebar-border: oklch(0.9401 0 0);
|
||||
--sidebar-ring: oklch(0.7731 0 0);
|
||||
--font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/claymorphism.css
Normal file
160
public/themes/claymorphism.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9232 0.0026 48.7171);
|
||||
--foreground: oklch(0.2795 0.0368 260.0310);
|
||||
--card: oklch(0.9699 0.0013 106.4238);
|
||||
--card-foreground: oklch(0.2795 0.0368 260.0310);
|
||||
--popover: oklch(0.9699 0.0013 106.4238);
|
||||
--popover-foreground: oklch(0.2795 0.0368 260.0310);
|
||||
--primary: oklch(0.5854 0.2041 277.1173);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.8687 0.0043 56.3660);
|
||||
--secondary-foreground: oklch(0.4461 0.0263 256.8018);
|
||||
--muted: oklch(0.9232 0.0026 48.7171);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.9376 0.0260 321.9388);
|
||||
--accent-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8687 0.0043 56.3660);
|
||||
--input: oklch(0.8687 0.0043 56.3660);
|
||||
--ring: oklch(0.5854 0.2041 277.1173);
|
||||
--chart-1: oklch(0.5854 0.2041 277.1173);
|
||||
--chart-2: oklch(0.5106 0.2301 276.9656);
|
||||
--chart-3: oklch(0.4568 0.2146 277.0229);
|
||||
--chart-4: oklch(0.3984 0.1773 277.3662);
|
||||
--chart-5: oklch(0.3588 0.1354 278.6973);
|
||||
--sidebar: oklch(0.8687 0.0043 56.3660);
|
||||
--sidebar-foreground: oklch(0.2795 0.0368 260.0310);
|
||||
--sidebar-primary: oklch(0.5854 0.2041 277.1173);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9376 0.0260 321.9388);
|
||||
--sidebar-accent-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-border: oklch(0.8687 0.0043 56.3660);
|
||||
--sidebar-ring: oklch(0.5854 0.2041 277.1173);
|
||||
--font-sans: Plus Jakarta Sans, sans-serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: Roboto Mono, monospace;
|
||||
--radius: 1.25rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 10px;
|
||||
--shadow-spread: 4px;
|
||||
--shadow-opacity: 0.18;
|
||||
--shadow-color: hsl(240 4% 60%);
|
||||
--shadow-2xs: 2px 2px 10px 4px hsl(240 4% 60% / 0.09);
|
||||
--shadow-xs: 2px 2px 10px 4px hsl(240 4% 60% / 0.09);
|
||||
--shadow-sm: 2px 2px 10px 4px hsl(240 4% 60% / 0.18), 2px 1px 2px 3px hsl(240 4% 60% / 0.18);
|
||||
--shadow: 2px 2px 10px 4px hsl(240 4% 60% / 0.18), 2px 1px 2px 3px hsl(240 4% 60% / 0.18);
|
||||
--shadow-md: 2px 2px 10px 4px hsl(240 4% 60% / 0.18), 2px 2px 4px 3px hsl(240 4% 60% / 0.18);
|
||||
--shadow-lg: 2px 2px 10px 4px hsl(240 4% 60% / 0.18), 2px 4px 6px 3px hsl(240 4% 60% / 0.18);
|
||||
--shadow-xl: 2px 2px 10px 4px hsl(240 4% 60% / 0.18), 2px 8px 10px 3px hsl(240 4% 60% / 0.18);
|
||||
--shadow-2xl: 2px 2px 10px 4px hsl(240 4% 60% / 0.45);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2244 0.0074 67.4370);
|
||||
--foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--card: oklch(0.2801 0.0080 59.3379);
|
||||
--card-foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--popover: oklch(0.2801 0.0080 59.3379);
|
||||
--popover-foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--primary: oklch(0.6801 0.1583 276.9349);
|
||||
--primary-foreground: oklch(0.2244 0.0074 67.4370);
|
||||
--secondary: oklch(0.3359 0.0077 59.4197);
|
||||
--secondary-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--muted: oklch(0.2287 0.0074 67.4469);
|
||||
--muted-foreground: oklch(0.7137 0.0192 261.3246);
|
||||
--accent: oklch(0.3896 0.0074 59.4734);
|
||||
--accent-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(0.2244 0.0074 67.4370);
|
||||
--border: oklch(0.3359 0.0077 59.4197);
|
||||
--input: oklch(0.3359 0.0077 59.4197);
|
||||
--ring: oklch(0.6801 0.1583 276.9349);
|
||||
--chart-1: oklch(0.6801 0.1583 276.9349);
|
||||
--chart-2: oklch(0.5854 0.2041 277.1173);
|
||||
--chart-3: oklch(0.5106 0.2301 276.9656);
|
||||
--chart-4: oklch(0.4568 0.2146 277.0229);
|
||||
--chart-5: oklch(0.3984 0.1773 277.3662);
|
||||
--sidebar: oklch(0.3359 0.0077 59.4197);
|
||||
--sidebar-foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--sidebar-primary: oklch(0.6801 0.1583 276.9349);
|
||||
--sidebar-primary-foreground: oklch(0.2244 0.0074 67.4370);
|
||||
--sidebar-accent: oklch(0.3896 0.0074 59.4734);
|
||||
--sidebar-accent-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--sidebar-border: oklch(0.3359 0.0077 59.4197);
|
||||
--sidebar-ring: oklch(0.6801 0.1583 276.9349);
|
||||
--font-sans: Plus Jakarta Sans, sans-serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: Roboto Mono, monospace;
|
||||
--radius: 1.25rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 10px;
|
||||
--shadow-spread: 4px;
|
||||
--shadow-opacity: 0.18;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 2px 2px 10px 4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-xs: 2px 2px 10px 4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-sm: 2px 2px 10px 4px hsl(0 0% 0% / 0.18), 2px 1px 2px 3px hsl(0 0% 0% / 0.18);
|
||||
--shadow: 2px 2px 10px 4px hsl(0 0% 0% / 0.18), 2px 1px 2px 3px hsl(0 0% 0% / 0.18);
|
||||
--shadow-md: 2px 2px 10px 4px hsl(0 0% 0% / 0.18), 2px 2px 4px 3px hsl(0 0% 0% / 0.18);
|
||||
--shadow-lg: 2px 2px 10px 4px hsl(0 0% 0% / 0.18), 2px 4px 6px 3px hsl(0 0% 0% / 0.18);
|
||||
--shadow-xl: 2px 2px 10px 4px hsl(0 0% 0% / 0.18), 2px 8px 10px 3px hsl(0 0% 0% / 0.18);
|
||||
--shadow-2xl: 2px 2px 10px 4px hsl(0 0% 0% / 0.45);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/cleanslate.css
Normal file
160
public/themes/cleanslate.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9842 0.0034 247.8575);
|
||||
--foreground: oklch(0.2795 0.0368 260.0310);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.2795 0.0368 260.0310);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.2795 0.0368 260.0310);
|
||||
--primary: oklch(0.5854 0.2041 277.1173);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9276 0.0058 264.5313);
|
||||
--secondary-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--muted: oklch(0.9670 0.0029 264.5419);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.9299 0.0334 272.7879);
|
||||
--accent-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8717 0.0093 258.3382);
|
||||
--input: oklch(0.8717 0.0093 258.3382);
|
||||
--ring: oklch(0.5854 0.2041 277.1173);
|
||||
--chart-1: oklch(0.5854 0.2041 277.1173);
|
||||
--chart-2: oklch(0.5106 0.2301 276.9656);
|
||||
--chart-3: oklch(0.4568 0.2146 277.0229);
|
||||
--chart-4: oklch(0.3984 0.1773 277.3662);
|
||||
--chart-5: oklch(0.3588 0.1354 278.6973);
|
||||
--sidebar: oklch(0.9670 0.0029 264.5419);
|
||||
--sidebar-foreground: oklch(0.2795 0.0368 260.0310);
|
||||
--sidebar-primary: oklch(0.5854 0.2041 277.1173);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9299 0.0334 272.7879);
|
||||
--sidebar-accent-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-border: oklch(0.8717 0.0093 258.3382);
|
||||
--sidebar-ring: oklch(0.5854 0.2041 277.1173);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Merriweather, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 8px;
|
||||
--shadow-spread: -1px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 2px 4px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 4px 6px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 8px 10px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2077 0.0398 265.7549);
|
||||
--foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--card: oklch(0.2795 0.0368 260.0310);
|
||||
--card-foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--popover: oklch(0.2795 0.0368 260.0310);
|
||||
--popover-foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--primary: oklch(0.6801 0.1583 276.9349);
|
||||
--primary-foreground: oklch(0.2077 0.0398 265.7549);
|
||||
--secondary: oklch(0.3351 0.0331 260.9120);
|
||||
--secondary-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--muted: oklch(0.2427 0.0381 259.9437);
|
||||
--muted-foreground: oklch(0.7137 0.0192 261.3246);
|
||||
--accent: oklch(0.3729 0.0306 259.7328);
|
||||
--accent-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(0.2077 0.0398 265.7549);
|
||||
--border: oklch(0.4461 0.0263 256.8018);
|
||||
--input: oklch(0.4461 0.0263 256.8018);
|
||||
--ring: oklch(0.6801 0.1583 276.9349);
|
||||
--chart-1: oklch(0.6801 0.1583 276.9349);
|
||||
--chart-2: oklch(0.5854 0.2041 277.1173);
|
||||
--chart-3: oklch(0.5106 0.2301 276.9656);
|
||||
--chart-4: oklch(0.4568 0.2146 277.0229);
|
||||
--chart-5: oklch(0.3984 0.1773 277.3662);
|
||||
--sidebar: oklch(0.2795 0.0368 260.0310);
|
||||
--sidebar-foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--sidebar-primary: oklch(0.6801 0.1583 276.9349);
|
||||
--sidebar-primary-foreground: oklch(0.2077 0.0398 265.7549);
|
||||
--sidebar-accent: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-accent-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--sidebar-border: oklch(0.4461 0.0263 256.8018);
|
||||
--sidebar-ring: oklch(0.6801 0.1583 276.9349);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Merriweather, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 8px;
|
||||
--shadow-spread: -1px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 2px 4px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 4px 6px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 8px 10px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/cosmicnight.css
Normal file
160
public/themes/cosmicnight.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9730 0.0133 286.1503);
|
||||
--foreground: oklch(0.3015 0.0572 282.4176);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3015 0.0572 282.4176);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3015 0.0572 282.4176);
|
||||
--primary: oklch(0.5417 0.1790 288.0332);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9174 0.0435 292.6901);
|
||||
--secondary-foreground: oklch(0.4143 0.1039 288.1742);
|
||||
--muted: oklch(0.9580 0.0133 286.1454);
|
||||
--muted-foreground: oklch(0.5426 0.0465 284.7435);
|
||||
--accent: oklch(0.9221 0.0373 262.1410);
|
||||
--accent-foreground: oklch(0.3015 0.0572 282.4176);
|
||||
--destructive: oklch(0.6861 0.2061 14.9941);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9115 0.0216 285.9625);
|
||||
--input: oklch(0.9115 0.0216 285.9625);
|
||||
--ring: oklch(0.5417 0.1790 288.0332);
|
||||
--chart-1: oklch(0.5417 0.1790 288.0332);
|
||||
--chart-2: oklch(0.7042 0.1602 288.9880);
|
||||
--chart-3: oklch(0.5679 0.2113 276.7065);
|
||||
--chart-4: oklch(0.6356 0.1922 281.8054);
|
||||
--chart-5: oklch(0.4509 0.1758 279.3838);
|
||||
--sidebar: oklch(0.9580 0.0133 286.1454);
|
||||
--sidebar-foreground: oklch(0.3015 0.0572 282.4176);
|
||||
--sidebar-primary: oklch(0.5417 0.1790 288.0332);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9221 0.0373 262.1410);
|
||||
--sidebar-accent-foreground: oklch(0.3015 0.0572 282.4176);
|
||||
--sidebar-border: oklch(0.9115 0.0216 285.9625);
|
||||
--sidebar-ring: oklch(0.5417 0.1790 288.0332);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 10px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(240 30% 25%);
|
||||
--shadow-2xs: 0px 4px 10px 0px hsl(240 30% 25% / 0.06);
|
||||
--shadow-xs: 0px 4px 10px 0px hsl(240 30% 25% / 0.06);
|
||||
--shadow-sm: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-md: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 2px 4px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-lg: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 4px 6px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-xl: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 8px 10px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-2xl: 0px 4px 10px 0px hsl(240 30% 25% / 0.30);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1743 0.0227 283.7998);
|
||||
--foreground: oklch(0.9185 0.0257 285.8834);
|
||||
--card: oklch(0.2284 0.0384 282.9324);
|
||||
--card-foreground: oklch(0.9185 0.0257 285.8834);
|
||||
--popover: oklch(0.2284 0.0384 282.9324);
|
||||
--popover-foreground: oklch(0.9185 0.0257 285.8834);
|
||||
--primary: oklch(0.7162 0.1597 290.3962);
|
||||
--primary-foreground: oklch(0.1743 0.0227 283.7998);
|
||||
--secondary: oklch(0.3139 0.0736 283.4591);
|
||||
--secondary-foreground: oklch(0.8367 0.0849 285.9111);
|
||||
--muted: oklch(0.2710 0.0621 281.4377);
|
||||
--muted-foreground: oklch(0.7166 0.0462 285.1741);
|
||||
--accent: oklch(0.3354 0.0828 280.9705);
|
||||
--accent-foreground: oklch(0.9185 0.0257 285.8834);
|
||||
--destructive: oklch(0.6861 0.2061 14.9941);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3261 0.0597 282.5832);
|
||||
--input: oklch(0.3261 0.0597 282.5832);
|
||||
--ring: oklch(0.7162 0.1597 290.3962);
|
||||
--chart-1: oklch(0.7162 0.1597 290.3962);
|
||||
--chart-2: oklch(0.6382 0.1047 274.9117);
|
||||
--chart-3: oklch(0.7482 0.1235 244.7492);
|
||||
--chart-4: oklch(0.7124 0.0977 186.6761);
|
||||
--chart-5: oklch(0.7546 0.1831 346.8124);
|
||||
--sidebar: oklch(0.2284 0.0384 282.9324);
|
||||
--sidebar-foreground: oklch(0.9185 0.0257 285.8834);
|
||||
--sidebar-primary: oklch(0.7162 0.1597 290.3962);
|
||||
--sidebar-primary-foreground: oklch(0.1743 0.0227 283.7998);
|
||||
--sidebar-accent: oklch(0.3354 0.0828 280.9705);
|
||||
--sidebar-accent-foreground: oklch(0.9185 0.0257 285.8834);
|
||||
--sidebar-border: oklch(0.3261 0.0597 282.5832);
|
||||
--sidebar-ring: oklch(0.7162 0.1597 290.3962);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 10px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(240 30% 25%);
|
||||
--shadow-2xs: 0px 4px 10px 0px hsl(240 30% 25% / 0.06);
|
||||
--shadow-xs: 0px 4px 10px 0px hsl(240 30% 25% / 0.06);
|
||||
--shadow-sm: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 1px 2px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-md: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 2px 4px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-lg: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 4px 6px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-xl: 0px 4px 10px 0px hsl(240 30% 25% / 0.12), 0px 8px 10px -1px hsl(240 30% 25% / 0.12);
|
||||
--shadow-2xl: 0px 4px 10px 0px hsl(240 30% 25% / 0.30);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/cyberpunk.css
Normal file
160
public/themes/cyberpunk.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9816 0.0017 247.8390);
|
||||
--foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--primary: oklch(0.6726 0.2904 341.4084);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9595 0.0200 286.0164);
|
||||
--secondary-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--muted: oklch(0.9595 0.0200 286.0164);
|
||||
--muted-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--accent: oklch(0.8903 0.1739 171.2690);
|
||||
--accent-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--destructive: oklch(0.6535 0.2348 34.0370);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9205 0.0086 225.0878);
|
||||
--input: oklch(0.9205 0.0086 225.0878);
|
||||
--ring: oklch(0.6726 0.2904 341.4084);
|
||||
--chart-1: oklch(0.6726 0.2904 341.4084);
|
||||
--chart-2: oklch(0.5488 0.2944 299.0954);
|
||||
--chart-3: oklch(0.8442 0.1457 209.2851);
|
||||
--chart-4: oklch(0.8903 0.1739 171.2690);
|
||||
--chart-5: oklch(0.9168 0.1915 101.4070);
|
||||
--sidebar: oklch(0.9595 0.0200 286.0164);
|
||||
--sidebar-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--sidebar-primary: oklch(0.6726 0.2904 341.4084);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8903 0.1739 171.2690);
|
||||
--sidebar-accent-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--sidebar-border: oklch(0.9205 0.0086 225.0878);
|
||||
--sidebar-ring: oklch(0.6726 0.2904 341.4084);
|
||||
--font-sans: Outfit, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 8px;
|
||||
--shadow-spread: -2px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 4px 8px -2px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 4px 8px -2px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 1px 2px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 1px 2px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 2px 4px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 4px 6px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 8px 10px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 4px 8px -2px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1649 0.0352 281.8285);
|
||||
--foreground: oklch(0.9513 0.0074 260.7315);
|
||||
--card: oklch(0.2542 0.0611 281.1423);
|
||||
--card-foreground: oklch(0.9513 0.0074 260.7315);
|
||||
--popover: oklch(0.2542 0.0611 281.1423);
|
||||
--popover-foreground: oklch(0.9513 0.0074 260.7315);
|
||||
--primary: oklch(0.6726 0.2904 341.4084);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.2542 0.0611 281.1423);
|
||||
--secondary-foreground: oklch(0.9513 0.0074 260.7315);
|
||||
--muted: oklch(0.2123 0.0522 280.9917);
|
||||
--muted-foreground: oklch(0.6245 0.0500 278.1046);
|
||||
--accent: oklch(0.8903 0.1739 171.2690);
|
||||
--accent-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--destructive: oklch(0.6535 0.2348 34.0370);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3279 0.0832 280.7890);
|
||||
--input: oklch(0.3279 0.0832 280.7890);
|
||||
--ring: oklch(0.6726 0.2904 341.4084);
|
||||
--chart-1: oklch(0.6726 0.2904 341.4084);
|
||||
--chart-2: oklch(0.5488 0.2944 299.0954);
|
||||
--chart-3: oklch(0.8442 0.1457 209.2851);
|
||||
--chart-4: oklch(0.8903 0.1739 171.2690);
|
||||
--chart-5: oklch(0.9168 0.1915 101.4070);
|
||||
--sidebar: oklch(0.1649 0.0352 281.8285);
|
||||
--sidebar-foreground: oklch(0.9513 0.0074 260.7315);
|
||||
--sidebar-primary: oklch(0.6726 0.2904 341.4084);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8903 0.1739 171.2690);
|
||||
--sidebar-accent-foreground: oklch(0.1649 0.0352 281.8285);
|
||||
--sidebar-border: oklch(0.3279 0.0832 280.7890);
|
||||
--sidebar-ring: oklch(0.6726 0.2904 341.4084);
|
||||
--font-sans: Outfit, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 8px;
|
||||
--shadow-spread: -2px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 4px 8px -2px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 4px 8px -2px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 1px 2px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 1px 2px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 2px 4px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 4px 6px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 4px 8px -2px hsl(0 0% 0% / 0.10), 0px 8px 10px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 4px 8px -2px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
171
public/themes/darkmatter.css
Normal file
171
public/themes/darkmatter.css
Normal file
@ -0,0 +1,171 @@
|
||||
:root {
|
||||
--background: oklch(1.0000 0 0);
|
||||
--foreground: oklch(0.2101 0.0318 264.6645);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.2101 0.0318 264.6645);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.2101 0.0318 264.6645);
|
||||
--primary: oklch(0.6716 0.1368 48.5130);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.5360 0.0398 196.0280);
|
||||
--secondary-foreground: oklch(1.0000 0 0);
|
||||
--muted: oklch(0.9670 0.0029 264.5419);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.9491 0 0);
|
||||
--accent-foreground: oklch(0.2101 0.0318 264.6645);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(0.9851 0 0);
|
||||
--border: oklch(0.9276 0.0058 264.5313);
|
||||
--input: oklch(0.9276 0.0058 264.5313);
|
||||
--ring: oklch(0.6716 0.1368 48.5130);
|
||||
--chart-1: oklch(0.5940 0.0443 196.0233);
|
||||
--chart-2: oklch(0.7214 0.1337 49.9802);
|
||||
--chart-3: oklch(0.8721 0.0864 68.5474);
|
||||
--chart-4: oklch(0.6268 0 0);
|
||||
--chart-5: oklch(0.6830 0 0);
|
||||
--sidebar: oklch(0.9670 0.0029 264.5419);
|
||||
--sidebar-foreground: oklch(0.2101 0.0318 264.6645);
|
||||
--sidebar-primary: oklch(0.6716 0.1368 48.5130);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(1.0000 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.2101 0.0318 264.6645);
|
||||
--sidebar-border: oklch(0.9276 0.0058 264.5313);
|
||||
--sidebar-ring: oklch(0.6716 0.1368 48.5130);
|
||||
--font-sans: Geist Mono, ui-monospace, monospace;
|
||||
--font-serif: serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.75rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 4px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.05;
|
||||
--shadow-color: #000000;
|
||||
--shadow-2xs: 0px 1px 4px 0px hsl(0 0% 0% / 0.03);
|
||||
--shadow-xs: 0px 1px 4px 0px hsl(0 0% 0% / 0.03);
|
||||
--shadow-sm: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 1px 2px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 1px 2px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-md: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 2px 4px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-lg: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 4px 6px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xl: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 8px 10px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-2xl: 0px 1px 4px 0px hsl(0 0% 0% / 0.13);
|
||||
--tracking-normal: 0rem;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1797 0.0043 308.1928);
|
||||
--foreground: oklch(0.8109 0 0);
|
||||
--card: oklch(0.1822 0 0);
|
||||
--card-foreground: oklch(0.8109 0 0);
|
||||
--popover: oklch(0.1797 0.0043 308.1928);
|
||||
--popover-foreground: oklch(0.8109 0 0);
|
||||
--primary: oklch(0.7214 0.1337 49.9802);
|
||||
--primary-foreground: oklch(0.1797 0.0043 308.1928);
|
||||
--secondary: oklch(0.5940 0.0443 196.0233);
|
||||
--secondary-foreground: oklch(0.1797 0.0043 308.1928);
|
||||
--muted: oklch(0.2520 0 0);
|
||||
--muted-foreground: oklch(0.6268 0 0);
|
||||
--accent: oklch(0.3211 0 0);
|
||||
--accent-foreground: oklch(0.8109 0 0);
|
||||
--destructive: oklch(0.5940 0.0443 196.0233);
|
||||
--destructive-foreground: oklch(0.1797 0.0043 308.1928);
|
||||
--border: oklch(0.2520 0 0);
|
||||
--input: oklch(0.2520 0 0);
|
||||
--ring: oklch(0.7214 0.1337 49.9802);
|
||||
--chart-1: oklch(0.5940 0.0443 196.0233);
|
||||
--chart-2: oklch(0.7214 0.1337 49.9802);
|
||||
--chart-3: oklch(0.8721 0.0864 68.5474);
|
||||
--chart-4: oklch(0.6268 0 0);
|
||||
--chart-5: oklch(0.6830 0 0);
|
||||
--sidebar: oklch(0.1822 0 0);
|
||||
--sidebar-foreground: oklch(0.8109 0 0);
|
||||
--sidebar-primary: oklch(0.7214 0.1337 49.9802);
|
||||
--sidebar-primary-foreground: oklch(0.1797 0.0043 308.1928);
|
||||
--sidebar-accent: oklch(0.3211 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.8109 0 0);
|
||||
--sidebar-border: oklch(0.2520 0 0);
|
||||
--sidebar-ring: oklch(0.7214 0.1337 49.9802);
|
||||
--font-sans: Geist Mono, ui-monospace, monospace;
|
||||
--font-serif: serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.75rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 4px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.05;
|
||||
--shadow-color: #000000;
|
||||
--shadow-2xs: 0px 1px 4px 0px hsl(0 0% 0% / 0.03);
|
||||
--shadow-xs: 0px 1px 4px 0px hsl(0 0% 0% / 0.03);
|
||||
--shadow-sm: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 1px 2px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 1px 2px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-md: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 2px 4px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-lg: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 4px 6px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xl: 0px 1px 4px 0px hsl(0 0% 0% / 0.05), 0px 8px 10px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-2xl: 0px 1px 4px 0px hsl(0 0% 0% / 0.13);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
|
||||
--tracking-tighter: calc(var(--tracking-normal) - 0.05em);
|
||||
--tracking-tight: calc(var(--tracking-normal) - 0.025em);
|
||||
--tracking-normal: var(--tracking-normal);
|
||||
--tracking-wide: calc(var(--tracking-normal) + 0.025em);
|
||||
--tracking-wider: calc(var(--tracking-normal) + 0.05em);
|
||||
--tracking-widest: calc(var(--tracking-normal) + 0.1em);
|
||||
}
|
||||
|
||||
body {
|
||||
letter-spacing: var(--tracking-normal);
|
||||
}
|
||||
160
public/themes/default.css
Normal file
160
public/themes/default.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.1450 0 0);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.1450 0 0);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.1450 0 0);
|
||||
--primary: oklch(0.2050 0 0);
|
||||
--primary-foreground: oklch(0.9850 0 0);
|
||||
--secondary: oklch(0.9700 0 0);
|
||||
--secondary-foreground: oklch(0.2050 0 0);
|
||||
--muted: oklch(0.9700 0 0);
|
||||
--muted-foreground: oklch(0.5560 0 0);
|
||||
--accent: oklch(0.9700 0 0);
|
||||
--accent-foreground: oklch(0.2050 0 0);
|
||||
--destructive: oklch(0.5770 0.2450 27.3250);
|
||||
--destructive-foreground: oklch(1 0 0);
|
||||
--border: oklch(0.9220 0 0);
|
||||
--input: oklch(0.9220 0 0);
|
||||
--ring: oklch(0.7080 0 0);
|
||||
--chart-1: oklch(0.8100 0.1000 252);
|
||||
--chart-2: oklch(0.6200 0.1900 260);
|
||||
--chart-3: oklch(0.5500 0.2200 263);
|
||||
--chart-4: oklch(0.4900 0.2200 264);
|
||||
--chart-5: oklch(0.4200 0.1800 266);
|
||||
--sidebar: oklch(0.9850 0 0);
|
||||
--sidebar-foreground: oklch(0.1450 0 0);
|
||||
--sidebar-primary: oklch(0.2050 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.9850 0 0);
|
||||
--sidebar-accent: oklch(0.9700 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.2050 0 0);
|
||||
--sidebar-border: oklch(0.9220 0 0);
|
||||
--sidebar-ring: oklch(0.7080 0 0);
|
||||
--font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.625rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1450 0 0);
|
||||
--foreground: oklch(0.9850 0 0);
|
||||
--card: oklch(0.2050 0 0);
|
||||
--card-foreground: oklch(0.9850 0 0);
|
||||
--popover: oklch(0.2690 0 0);
|
||||
--popover-foreground: oklch(0.9850 0 0);
|
||||
--primary: oklch(0.9220 0 0);
|
||||
--primary-foreground: oklch(0.2050 0 0);
|
||||
--secondary: oklch(0.2690 0 0);
|
||||
--secondary-foreground: oklch(0.9850 0 0);
|
||||
--muted: oklch(0.2690 0 0);
|
||||
--muted-foreground: oklch(0.7080 0 0);
|
||||
--accent: oklch(0.3710 0 0);
|
||||
--accent-foreground: oklch(0.9850 0 0);
|
||||
--destructive: oklch(0.7040 0.1910 22.2160);
|
||||
--destructive-foreground: oklch(0.9850 0 0);
|
||||
--border: oklch(0.2750 0 0);
|
||||
--input: oklch(0.3250 0 0);
|
||||
--ring: oklch(0.5560 0 0);
|
||||
--chart-1: oklch(0.8100 0.1000 252);
|
||||
--chart-2: oklch(0.6200 0.1900 260);
|
||||
--chart-3: oklch(0.5500 0.2200 263);
|
||||
--chart-4: oklch(0.4900 0.2200 264);
|
||||
--chart-5: oklch(0.4200 0.1800 266);
|
||||
--sidebar: oklch(0.2050 0 0);
|
||||
--sidebar-foreground: oklch(0.9850 0 0);
|
||||
--sidebar-primary: oklch(0.4880 0.2430 264.3760);
|
||||
--sidebar-primary-foreground: oklch(0.9850 0 0);
|
||||
--sidebar-accent: oklch(0.2690 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.9850 0 0);
|
||||
--sidebar-border: oklch(0.2750 0 0);
|
||||
--sidebar-ring: oklch(0.4390 0 0);
|
||||
--font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.625rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/doom64.css
Normal file
160
public/themes/doom64.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.8452 0 0);
|
||||
--foreground: oklch(0.2393 0 0);
|
||||
--card: oklch(0.7572 0 0);
|
||||
--card-foreground: oklch(0.2393 0 0);
|
||||
--popover: oklch(0.7572 0 0);
|
||||
--popover-foreground: oklch(0.2393 0 0);
|
||||
--primary: oklch(0.5016 0.1887 27.4816);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.4955 0.0896 126.1858);
|
||||
--secondary-foreground: oklch(1.0000 0 0);
|
||||
--muted: oklch(0.7826 0 0);
|
||||
--muted-foreground: oklch(0.4091 0 0);
|
||||
--accent: oklch(0.5880 0.0993 245.7394);
|
||||
--accent-foreground: oklch(1.0000 0 0);
|
||||
--destructive: oklch(0.7076 0.1975 46.4558);
|
||||
--destructive-foreground: oklch(0 0 0);
|
||||
--border: oklch(0.4313 0 0);
|
||||
--input: oklch(0.4313 0 0);
|
||||
--ring: oklch(0.5016 0.1887 27.4816);
|
||||
--chart-1: oklch(0.5016 0.1887 27.4816);
|
||||
--chart-2: oklch(0.4955 0.0896 126.1858);
|
||||
--chart-3: oklch(0.5880 0.0993 245.7394);
|
||||
--chart-4: oklch(0.7076 0.1975 46.4558);
|
||||
--chart-5: oklch(0.5656 0.0431 40.4319);
|
||||
--sidebar: oklch(0.7572 0 0);
|
||||
--sidebar-foreground: oklch(0.2393 0 0);
|
||||
--sidebar-primary: oklch(0.5016 0.1887 27.4816);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.5880 0.0993 245.7394);
|
||||
--sidebar-accent-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-border: oklch(0.4313 0 0);
|
||||
--sidebar-ring: oklch(0.5016 0.1887 27.4816);
|
||||
--font-sans: "Oxanium", sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: "Source Code Pro", monospace;
|
||||
--radius: 0px;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 4px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.4;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 2px 4px 0px hsl(0 0% 0% / 0.20);
|
||||
--shadow-xs: 0px 2px 4px 0px hsl(0 0% 0% / 0.20);
|
||||
--shadow-sm: 0px 2px 4px 0px hsl(0 0% 0% / 0.40), 0px 1px 2px -1px hsl(0 0% 0% / 0.40);
|
||||
--shadow: 0px 2px 4px 0px hsl(0 0% 0% / 0.40), 0px 1px 2px -1px hsl(0 0% 0% / 0.40);
|
||||
--shadow-md: 0px 2px 4px 0px hsl(0 0% 0% / 0.40), 0px 2px 4px -1px hsl(0 0% 0% / 0.40);
|
||||
--shadow-lg: 0px 2px 4px 0px hsl(0 0% 0% / 0.40), 0px 4px 6px -1px hsl(0 0% 0% / 0.40);
|
||||
--shadow-xl: 0px 2px 4px 0px hsl(0 0% 0% / 0.40), 0px 8px 10px -1px hsl(0 0% 0% / 0.40);
|
||||
--shadow-2xl: 0px 2px 4px 0px hsl(0 0% 0% / 1.00);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2178 0 0);
|
||||
--foreground: oklch(0.9067 0 0);
|
||||
--card: oklch(0.2850 0 0);
|
||||
--card-foreground: oklch(0.9067 0 0);
|
||||
--popover: oklch(0.2850 0 0);
|
||||
--popover-foreground: oklch(0.9067 0 0);
|
||||
--primary: oklch(0.6083 0.2090 27.0276);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.6423 0.1467 133.0145);
|
||||
--secondary-foreground: oklch(0 0 0);
|
||||
--muted: oklch(0.2645 0 0);
|
||||
--muted-foreground: oklch(0.7058 0 0);
|
||||
--accent: oklch(0.7482 0.1235 244.7492);
|
||||
--accent-foreground: oklch(0 0 0);
|
||||
--destructive: oklch(0.7839 0.1719 68.0943);
|
||||
--destructive-foreground: oklch(0 0 0);
|
||||
--border: oklch(0.4091 0 0);
|
||||
--input: oklch(0.4091 0 0);
|
||||
--ring: oklch(0.6083 0.2090 27.0276);
|
||||
--chart-1: oklch(0.6083 0.2090 27.0276);
|
||||
--chart-2: oklch(0.6423 0.1467 133.0145);
|
||||
--chart-3: oklch(0.7482 0.1235 244.7492);
|
||||
--chart-4: oklch(0.7839 0.1719 68.0943);
|
||||
--chart-5: oklch(0.6471 0.0334 40.7963);
|
||||
--sidebar: oklch(0.1913 0 0);
|
||||
--sidebar-foreground: oklch(0.9067 0 0);
|
||||
--sidebar-primary: oklch(0.6083 0.2090 27.0276);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.7482 0.1235 244.7492);
|
||||
--sidebar-accent-foreground: oklch(0 0 0);
|
||||
--sidebar-border: oklch(0.4091 0 0);
|
||||
--sidebar-ring: oklch(0.6083 0.2090 27.0276);
|
||||
--font-sans: "Oxanium", sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: "Source Code Pro", monospace;
|
||||
--radius: 0px;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 5px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.6;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 2px 5px 0px hsl(0 0% 0% / 0.30);
|
||||
--shadow-xs: 0px 2px 5px 0px hsl(0 0% 0% / 0.30);
|
||||
--shadow-sm: 0px 2px 5px 0px hsl(0 0% 0% / 0.60), 0px 1px 2px -1px hsl(0 0% 0% / 0.60);
|
||||
--shadow: 0px 2px 5px 0px hsl(0 0% 0% / 0.60), 0px 1px 2px -1px hsl(0 0% 0% / 0.60);
|
||||
--shadow-md: 0px 2px 5px 0px hsl(0 0% 0% / 0.60), 0px 2px 4px -1px hsl(0 0% 0% / 0.60);
|
||||
--shadow-lg: 0px 2px 5px 0px hsl(0 0% 0% / 0.60), 0px 4px 6px -1px hsl(0 0% 0% / 0.60);
|
||||
--shadow-xl: 0px 2px 5px 0px hsl(0 0% 0% / 0.60), 0px 8px 10px -1px hsl(0 0% 0% / 0.60);
|
||||
--shadow-2xl: 0px 2px 5px 0px hsl(0 0% 0% / 1.50);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/eleganyluxury.css
Normal file
160
public/themes/eleganyluxury.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--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);
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: Libre Baskerville, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 0.375rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 16px;
|
||||
--shadow-spread: -2px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(0 63% 18%);
|
||||
--shadow-2xs: 1px 1px 16px -2px hsl(0 63% 18% / 0.06);
|
||||
--shadow-xs: 1px 1px 16px -2px hsl(0 63% 18% / 0.06);
|
||||
--shadow-sm: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 1px 2px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 1px 2px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-md: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 2px 4px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-lg: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 4px 6px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-xl: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 8px 10px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-2xl: 1px 1px 16px -2px hsl(0 63% 18% / 0.30);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.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);
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: Libre Baskerville, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 0.375rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 16px;
|
||||
--shadow-spread: -2px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(0 63% 18%);
|
||||
--shadow-2xs: 1px 1px 16px -2px hsl(0 63% 18% / 0.06);
|
||||
--shadow-xs: 1px 1px 16px -2px hsl(0 63% 18% / 0.06);
|
||||
--shadow-sm: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 1px 2px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 1px 2px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-md: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 2px 4px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-lg: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 4px 6px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-xl: 1px 1px 16px -2px hsl(0 63% 18% / 0.12), 1px 8px 10px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-2xl: 1px 1px 16px -2px hsl(0 63% 18% / 0.30);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/graphite.css
Normal file
160
public/themes/graphite.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9551 0 0);
|
||||
--foreground: oklch(0.3211 0 0);
|
||||
--card: oklch(0.9702 0 0);
|
||||
--card-foreground: oklch(0.3211 0 0);
|
||||
--popover: oklch(0.9702 0 0);
|
||||
--popover-foreground: oklch(0.3211 0 0);
|
||||
--primary: oklch(0.4891 0 0);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9067 0 0);
|
||||
--secondary-foreground: oklch(0.3211 0 0);
|
||||
--muted: oklch(0.8853 0 0);
|
||||
--muted-foreground: oklch(0.5103 0 0);
|
||||
--accent: oklch(0.8078 0 0);
|
||||
--accent-foreground: oklch(0.3211 0 0);
|
||||
--destructive: oklch(0.5594 0.1900 25.8625);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8576 0 0);
|
||||
--input: oklch(0.9067 0 0);
|
||||
--ring: oklch(0.4891 0 0);
|
||||
--chart-1: oklch(0.4891 0 0);
|
||||
--chart-2: oklch(0.4863 0.0361 196.0278);
|
||||
--chart-3: oklch(0.6534 0 0);
|
||||
--chart-4: oklch(0.7316 0 0);
|
||||
--chart-5: oklch(0.8078 0 0);
|
||||
--sidebar: oklch(0.9370 0 0);
|
||||
--sidebar-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-primary: oklch(0.4891 0 0);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8078 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-border: oklch(0.8576 0 0);
|
||||
--sidebar-ring: oklch(0.4891 0 0);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.35rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.15;
|
||||
--shadow-color: hsl(0 0% 20% / 0.1);
|
||||
--shadow-2xs: 0px 2px 0px 0px hsl(0 0% 20% / 0.07);
|
||||
--shadow-xs: 0px 2px 0px 0px hsl(0 0% 20% / 0.07);
|
||||
--shadow-sm: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 1px 2px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 1px 2px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow-md: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 2px 4px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow-lg: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 4px 6px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow-xl: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 8px 10px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow-2xl: 0px 2px 0px 0px hsl(0 0% 20% / 0.38);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2178 0 0);
|
||||
--foreground: oklch(0.8853 0 0);
|
||||
--card: oklch(0.2435 0 0);
|
||||
--card-foreground: oklch(0.8853 0 0);
|
||||
--popover: oklch(0.2435 0 0);
|
||||
--popover-foreground: oklch(0.8853 0 0);
|
||||
--primary: oklch(0.7058 0 0);
|
||||
--primary-foreground: oklch(0.2178 0 0);
|
||||
--secondary: oklch(0.3092 0 0);
|
||||
--secondary-foreground: oklch(0.8853 0 0);
|
||||
--muted: oklch(0.2850 0 0);
|
||||
--muted-foreground: oklch(0.5999 0 0);
|
||||
--accent: oklch(0.3715 0 0);
|
||||
--accent-foreground: oklch(0.8853 0 0);
|
||||
--destructive: oklch(0.6591 0.1530 22.1703);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3290 0 0);
|
||||
--input: oklch(0.3092 0 0);
|
||||
--ring: oklch(0.7058 0 0);
|
||||
--chart-1: oklch(0.7058 0 0);
|
||||
--chart-2: oklch(0.6714 0.0339 206.3482);
|
||||
--chart-3: oklch(0.5452 0 0);
|
||||
--chart-4: oklch(0.4604 0 0);
|
||||
--chart-5: oklch(0.3715 0 0);
|
||||
--sidebar: oklch(0.2393 0 0);
|
||||
--sidebar-foreground: oklch(0.8853 0 0);
|
||||
--sidebar-primary: oklch(0.7058 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.2178 0 0);
|
||||
--sidebar-accent: oklch(0.3715 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.8853 0 0);
|
||||
--sidebar-border: oklch(0.3290 0 0);
|
||||
--sidebar-ring: oklch(0.7058 0 0);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.35rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.15;
|
||||
--shadow-color: hsl(0 0% 20% / 0.1);
|
||||
--shadow-2xs: 0px 2px 0px 0px hsl(0 0% 20% / 0.07);
|
||||
--shadow-xs: 0px 2px 0px 0px hsl(0 0% 20% / 0.07);
|
||||
--shadow-sm: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 1px 2px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 1px 2px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow-md: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 2px 4px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow-lg: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 4px 6px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow-xl: 0px 2px 0px 0px hsl(0 0% 20% / 0.15), 0px 8px 10px -1px hsl(0 0% 20% / 0.15);
|
||||
--shadow-2xl: 0px 2px 0px 0px hsl(0 0% 20% / 0.38);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/kodama.css
Normal file
160
public/themes/kodama.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.8798 0.0534 91.7893);
|
||||
--foreground: oklch(0.4265 0.0310 59.2153);
|
||||
--card: oklch(0.8937 0.0395 87.5676);
|
||||
--card-foreground: oklch(0.4265 0.0310 59.2153);
|
||||
--popover: oklch(0.9378 0.0331 89.8515);
|
||||
--popover-foreground: oklch(0.4265 0.0310 59.2153);
|
||||
--primary: oklch(0.6657 0.1050 118.9078);
|
||||
--primary-foreground: oklch(0.9882 0.0069 88.6415);
|
||||
--secondary: oklch(0.8532 0.0631 91.1493);
|
||||
--secondary-foreground: oklch(0.4265 0.0310 59.2153);
|
||||
--muted: oklch(0.8532 0.0631 91.1493);
|
||||
--muted-foreground: oklch(0.5761 0.0259 60.9323);
|
||||
--accent: oklch(0.8361 0.0713 90.3269);
|
||||
--accent-foreground: oklch(0.4265 0.0310 59.2153);
|
||||
--destructive: oklch(0.7136 0.0981 29.9827);
|
||||
--destructive-foreground: oklch(0.9790 0.0082 91.4818);
|
||||
--border: oklch(0.6918 0.0440 59.8448);
|
||||
--input: oklch(0.8361 0.0713 90.3269);
|
||||
--ring: oklch(0.7350 0.0564 130.8494);
|
||||
--chart-1: oklch(0.7350 0.0564 130.8494);
|
||||
--chart-2: oklch(0.6762 0.0567 132.4479);
|
||||
--chart-3: oklch(0.8185 0.0332 136.6539);
|
||||
--chart-4: oklch(0.5929 0.0464 137.6224);
|
||||
--chart-5: oklch(0.5183 0.0390 137.1892);
|
||||
--sidebar: oklch(0.8631 0.0645 90.5161);
|
||||
--sidebar-foreground: oklch(0.4265 0.0310 59.2153);
|
||||
--sidebar-primary: oklch(0.7350 0.0564 130.8494);
|
||||
--sidebar-primary-foreground: oklch(0.9882 0.0069 88.6415);
|
||||
--sidebar-accent: oklch(0.9225 0.0169 88.0027);
|
||||
--sidebar-accent-foreground: oklch(0.4265 0.0310 59.2153);
|
||||
--sidebar-border: oklch(0.9073 0.0170 88.0044);
|
||||
--sidebar-ring: oklch(0.7350 0.0564 130.8494);
|
||||
--font-sans: Merriweather, serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.425rem;
|
||||
--shadow-x: 3px;
|
||||
--shadow-y: 3px;
|
||||
--shadow-blur: 2px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.15;
|
||||
--shadow-color: hsl(88 22% 35% / 0.15);
|
||||
--shadow-2xs: 3px 3px 2px 0px hsl(88 22% 35% / 0.07);
|
||||
--shadow-xs: 3px 3px 2px 0px hsl(88 22% 35% / 0.07);
|
||||
--shadow-sm: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 1px 2px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 1px 2px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow-md: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 2px 4px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow-lg: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 4px 6px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow-xl: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 8px 10px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow-2xl: 3px 3px 2px 0px hsl(88 22% 35% / 0.38);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.3303 0.0214 88.0737);
|
||||
--foreground: oklch(0.9217 0.0235 82.1191);
|
||||
--card: oklch(0.3583 0.0165 82.3257);
|
||||
--card-foreground: oklch(0.9217 0.0235 82.1191);
|
||||
--popover: oklch(0.3583 0.0165 82.3257);
|
||||
--popover-foreground: oklch(0.9217 0.0235 82.1191);
|
||||
--primary: oklch(0.6762 0.0567 132.4479);
|
||||
--primary-foreground: oklch(0.2686 0.0105 61.0213);
|
||||
--secondary: oklch(0.4448 0.0239 84.5498);
|
||||
--secondary-foreground: oklch(0.9217 0.0235 82.1191);
|
||||
--muted: oklch(0.3892 0.0197 82.7084);
|
||||
--muted-foreground: oklch(0.7096 0.0171 73.6179);
|
||||
--accent: oklch(0.6540 0.0723 90.7629);
|
||||
--accent-foreground: oklch(0.2686 0.0105 61.0213);
|
||||
--destructive: oklch(0.6287 0.0821 31.2958);
|
||||
--destructive-foreground: oklch(0.9357 0.0201 84.5907);
|
||||
--border: oklch(0.4448 0.0239 84.5498);
|
||||
--input: oklch(0.4448 0.0239 84.5498);
|
||||
--ring: oklch(0.6762 0.0567 132.4479);
|
||||
--chart-1: oklch(0.6762 0.0567 132.4479);
|
||||
--chart-2: oklch(0.7350 0.0564 130.8494);
|
||||
--chart-3: oklch(0.5929 0.0464 137.6224);
|
||||
--chart-4: oklch(0.6540 0.0723 90.7629);
|
||||
--chart-5: oklch(0.5183 0.0390 137.1892);
|
||||
--sidebar: oklch(0.3303 0.0214 88.0737);
|
||||
--sidebar-foreground: oklch(0.9217 0.0235 82.1191);
|
||||
--sidebar-primary: oklch(0.6762 0.0567 132.4479);
|
||||
--sidebar-primary-foreground: oklch(0.2686 0.0105 61.0213);
|
||||
--sidebar-accent: oklch(0.6540 0.0723 90.7629);
|
||||
--sidebar-accent-foreground: oklch(0.2686 0.0105 61.0213);
|
||||
--sidebar-border: oklch(0.4448 0.0239 84.5498);
|
||||
--sidebar-ring: oklch(0.6762 0.0567 132.4479);
|
||||
--font-sans: Merriweather, serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.425rem;
|
||||
--shadow-x: 3px;
|
||||
--shadow-y: 3px;
|
||||
--shadow-blur: 2px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.15;
|
||||
--shadow-color: hsl(88 22% 35% / 0.15);
|
||||
--shadow-2xs: 3px 3px 2px 0px hsl(88 22% 35% / 0.07);
|
||||
--shadow-xs: 3px 3px 2px 0px hsl(88 22% 35% / 0.07);
|
||||
--shadow-sm: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 1px 2px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 1px 2px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow-md: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 2px 4px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow-lg: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 4px 6px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow-xl: 3px 3px 2px 0px hsl(88 22% 35% / 0.15), 3px 8px 10px -1px hsl(88 22% 35% / 0.15);
|
||||
--shadow-2xl: 3px 3px 2px 0px hsl(88 22% 35% / 0.38);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/midnight.css
Normal file
160
public/themes/midnight.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9821 0 0);
|
||||
--foreground: oklch(0.3211 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3211 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3211 0 0);
|
||||
--primary: oklch(0.5676 0.2021 283.0838);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.8214 0.0720 249.3482);
|
||||
--secondary-foreground: oklch(0.3211 0 0);
|
||||
--muted: oklch(0.8202 0.0213 91.6163);
|
||||
--muted-foreground: oklch(0.5382 0 0);
|
||||
--accent: oklch(0.6475 0.0642 117.4260);
|
||||
--accent-foreground: oklch(1.0000 0 0);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8699 0 0);
|
||||
--input: oklch(0.8699 0 0);
|
||||
--ring: oklch(0.5676 0.2021 283.0838);
|
||||
--chart-1: oklch(0.5676 0.2021 283.0838);
|
||||
--chart-2: oklch(0.5261 0.1705 314.6534);
|
||||
--chart-3: oklch(0.3390 0.1793 301.6848);
|
||||
--chart-4: oklch(0.6746 0.1414 261.3380);
|
||||
--chart-5: oklch(0.5880 0.0993 245.7394);
|
||||
--sidebar: oklch(0.9821 0 0);
|
||||
--sidebar-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-primary: oklch(0.5676 0.2021 283.0838);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.6475 0.0642 117.4260);
|
||||
--sidebar-accent-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-border: oklch(0.8699 0 0);
|
||||
--sidebar-ring: oklch(0.5676 0.2021 283.0838);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Playfair Display, serif;
|
||||
--font-mono: Source Code Pro, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 5px;
|
||||
--shadow-blur: 10px;
|
||||
--shadow-spread: -2px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 5px 10px -2px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 5px 10px -2px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 1px 2px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 1px 2px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 2px 4px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 4px 6px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 8px 10px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 5px 10px -2px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2303 0.0125 264.2926);
|
||||
--foreground: oklch(0.9219 0 0);
|
||||
--card: oklch(0.3210 0.0078 223.6661);
|
||||
--card-foreground: oklch(0.9219 0 0);
|
||||
--popover: oklch(0.3210 0.0078 223.6661);
|
||||
--popover-foreground: oklch(0.9219 0 0);
|
||||
--primary: oklch(0.5676 0.2021 283.0838);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.3390 0.1793 301.6848);
|
||||
--secondary-foreground: oklch(0.9219 0 0);
|
||||
--muted: oklch(0.3867 0 0);
|
||||
--muted-foreground: oklch(0.7155 0 0);
|
||||
--accent: oklch(0.6746 0.1414 261.3380);
|
||||
--accent-foreground: oklch(0.9219 0 0);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3867 0 0);
|
||||
--input: oklch(0.3867 0 0);
|
||||
--ring: oklch(0.5676 0.2021 283.0838);
|
||||
--chart-1: oklch(0.5676 0.2021 283.0838);
|
||||
--chart-2: oklch(0.5261 0.1705 314.6534);
|
||||
--chart-3: oklch(0.3390 0.1793 301.6848);
|
||||
--chart-4: oklch(0.6746 0.1414 261.3380);
|
||||
--chart-5: oklch(0.5880 0.0993 245.7394);
|
||||
--sidebar: oklch(0.2303 0.0125 264.2926);
|
||||
--sidebar-foreground: oklch(0.9219 0 0);
|
||||
--sidebar-primary: oklch(0.5676 0.2021 283.0838);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.6746 0.1414 261.3380);
|
||||
--sidebar-accent-foreground: oklch(0.9219 0 0);
|
||||
--sidebar-border: oklch(0.3867 0 0);
|
||||
--sidebar-ring: oklch(0.5676 0.2021 283.0838);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Playfair Display, serif;
|
||||
--font-mono: Source Code Pro, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 5px;
|
||||
--shadow-blur: 10px;
|
||||
--shadow-spread: -2px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 5px 10px -2px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 5px 10px -2px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 1px 2px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 1px 2px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 2px 4px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 4px 6px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 5px 10px -2px hsl(0 0% 0% / 0.10), 0px 8px 10px -3px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 5px 10px -2px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/mocha.css
Normal file
160
public/themes/mocha.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9529 0.0146 102.4597);
|
||||
--foreground: oklch(0.4063 0.0255 40.3627);
|
||||
--card: oklch(0.9529 0.0146 102.4597);
|
||||
--card-foreground: oklch(0.4063 0.0255 40.3627);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.4063 0.0255 40.3627);
|
||||
--primary: oklch(0.6083 0.0623 44.3588);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.7473 0.0387 80.5476);
|
||||
--secondary-foreground: oklch(1.0000 0 0);
|
||||
--muted: oklch(0.8502 0.0389 49.0874);
|
||||
--muted-foreground: oklch(0.5416 0.0512 37.2132);
|
||||
--accent: oklch(0.8502 0.0389 49.0874);
|
||||
--accent-foreground: oklch(0.4063 0.0255 40.3627);
|
||||
--destructive: oklch(0.2225 0.0098 52.9636);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.7473 0.0387 80.5476);
|
||||
--input: oklch(0.7473 0.0387 80.5476);
|
||||
--ring: oklch(0.6083 0.0623 44.3588);
|
||||
--chart-1: oklch(0.6083 0.0623 44.3588);
|
||||
--chart-2: oklch(0.5416 0.0512 37.2132);
|
||||
--chart-3: oklch(0.7272 0.0539 52.3320);
|
||||
--chart-4: oklch(0.7473 0.0387 80.5476);
|
||||
--chart-5: oklch(0.6440 0.0405 52.3917);
|
||||
--sidebar: oklch(0.8903 0.0278 49.5658);
|
||||
--sidebar-foreground: oklch(0.4063 0.0255 40.3627);
|
||||
--sidebar-primary: oklch(0.6083 0.0623 44.3588);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.7272 0.0539 52.3320);
|
||||
--sidebar-accent-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-border: oklch(0.6440 0.0405 52.3917);
|
||||
--sidebar-ring: oklch(0.6083 0.0623 44.3588);
|
||||
--font-sans: DM Sans, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Menlo, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.11;
|
||||
--shadow-color: hsl(20 18% 51% / 0.4);
|
||||
--shadow-2xs: 2px 2px 0px 0px hsl(20 18% 51% / 0.06);
|
||||
--shadow-xs: 2px 2px 0px 0px hsl(20 18% 51% / 0.06);
|
||||
--shadow-sm: 2px 2px 0px 0px hsl(20 18% 51% / 0.11), 2px 1px 2px -1px hsl(20 18% 51% / 0.11);
|
||||
--shadow: 2px 2px 0px 0px hsl(20 18% 51% / 0.11), 2px 1px 2px -1px hsl(20 18% 51% / 0.11);
|
||||
--shadow-md: 2px 2px 0px 0px hsl(20 18% 51% / 0.11), 2px 2px 4px -1px hsl(20 18% 51% / 0.11);
|
||||
--shadow-lg: 2px 2px 0px 0px hsl(20 18% 51% / 0.11), 2px 4px 6px -1px hsl(20 18% 51% / 0.11);
|
||||
--shadow-xl: 2px 2px 0px 0px hsl(20 18% 51% / 0.11), 2px 8px 10px -1px hsl(20 18% 51% / 0.11);
|
||||
--shadow-2xl: 2px 2px 0px 0px hsl(20 18% 51% / 0.28);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2721 0.0141 48.1783);
|
||||
--foreground: oklch(0.9529 0.0146 102.4597);
|
||||
--card: oklch(0.3291 0.0156 50.8936);
|
||||
--card-foreground: oklch(0.9529 0.0146 102.4597);
|
||||
--popover: oklch(0.3291 0.0156 50.8936);
|
||||
--popover-foreground: oklch(0.9529 0.0146 102.4597);
|
||||
--primary: oklch(0.7272 0.0539 52.3320);
|
||||
--primary-foreground: oklch(0.2721 0.0141 48.1783);
|
||||
--secondary: oklch(0.5416 0.0512 37.2132);
|
||||
--secondary-foreground: oklch(0.9529 0.0146 102.4597);
|
||||
--muted: oklch(0.4063 0.0255 40.3627);
|
||||
--muted-foreground: oklch(0.7575 0.0380 50.8610);
|
||||
--accent: oklch(0.7473 0.0387 80.5476);
|
||||
--accent-foreground: oklch(0.2721 0.0141 48.1783);
|
||||
--destructive: oklch(0.6875 0.1420 21.4566);
|
||||
--destructive-foreground: oklch(0.2721 0.0141 48.1783);
|
||||
--border: oklch(0.4063 0.0255 40.3627);
|
||||
--input: oklch(0.4063 0.0255 40.3627);
|
||||
--ring: oklch(0.7272 0.0539 52.3320);
|
||||
--chart-1: oklch(0.7272 0.0539 52.3320);
|
||||
--chart-2: oklch(0.7473 0.0387 80.5476);
|
||||
--chart-3: oklch(0.6083 0.0623 44.3588);
|
||||
--chart-4: oklch(0.5416 0.0512 37.2132);
|
||||
--chart-5: oklch(0.6440 0.0405 52.3917);
|
||||
--sidebar: oklch(0.2225 0.0098 52.9636);
|
||||
--sidebar-foreground: oklch(0.9529 0.0146 102.4597);
|
||||
--sidebar-primary: oklch(0.7272 0.0539 52.3320);
|
||||
--sidebar-primary-foreground: oklch(0.2225 0.0098 52.9636);
|
||||
--sidebar-accent: oklch(0.7473 0.0387 80.5476);
|
||||
--sidebar-accent-foreground: oklch(0.2225 0.0098 52.9636);
|
||||
--sidebar-border: oklch(0.4063 0.0255 40.3627);
|
||||
--sidebar-ring: oklch(0.7272 0.0539 52.3320);
|
||||
--font-sans: DM Sans, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Menlo, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.11;
|
||||
--shadow-color: hsl(20 18% 30% / 0.5);
|
||||
--shadow-2xs: 2px 2px 0px 0px hsl(20 18% 30% / 0.06);
|
||||
--shadow-xs: 2px 2px 0px 0px hsl(20 18% 30% / 0.06);
|
||||
--shadow-sm: 2px 2px 0px 0px hsl(20 18% 30% / 0.11), 2px 1px 2px -1px hsl(20 18% 30% / 0.11);
|
||||
--shadow: 2px 2px 0px 0px hsl(20 18% 30% / 0.11), 2px 1px 2px -1px hsl(20 18% 30% / 0.11);
|
||||
--shadow-md: 2px 2px 0px 0px hsl(20 18% 30% / 0.11), 2px 2px 4px -1px hsl(20 18% 30% / 0.11);
|
||||
--shadow-lg: 2px 2px 0px 0px hsl(20 18% 30% / 0.11), 2px 4px 6px -1px hsl(20 18% 30% / 0.11);
|
||||
--shadow-xl: 2px 2px 0px 0px hsl(20 18% 30% / 0.11), 2px 8px 10px -1px hsl(20 18% 30% / 0.11);
|
||||
--shadow-2xl: 2px 2px 0px 0px hsl(20 18% 30% / 0.28);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/modern.css
Normal file
160
public/themes/modern.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(1.0000 0 0);
|
||||
--foreground: oklch(0.3211 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3211 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3211 0 0);
|
||||
--primary: oklch(0.6231 0.1880 259.8145);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9670 0.0029 264.5419);
|
||||
--secondary-foreground: oklch(0.4461 0.0263 256.8018);
|
||||
--muted: oklch(0.9846 0.0017 247.8389);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.9514 0.0250 236.8242);
|
||||
--accent-foreground: oklch(0.3791 0.1378 265.5222);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9276 0.0058 264.5313);
|
||||
--input: oklch(0.9276 0.0058 264.5313);
|
||||
--ring: oklch(0.6231 0.1880 259.8145);
|
||||
--chart-1: oklch(0.6231 0.1880 259.8145);
|
||||
--chart-2: oklch(0.5461 0.2152 262.8809);
|
||||
--chart-3: oklch(0.4882 0.2172 264.3763);
|
||||
--chart-4: oklch(0.4244 0.1809 265.6377);
|
||||
--chart-5: oklch(0.3791 0.1378 265.5222);
|
||||
--sidebar: oklch(0.9846 0.0017 247.8389);
|
||||
--sidebar-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-primary: oklch(0.6231 0.1880 259.8145);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9514 0.0250 236.8242);
|
||||
--sidebar-accent-foreground: oklch(0.3791 0.1378 265.5222);
|
||||
--sidebar-border: oklch(0.9276 0.0058 264.5313);
|
||||
--sidebar-ring: oklch(0.6231 0.1880 259.8145);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.375rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2046 0 0);
|
||||
--foreground: oklch(0.9219 0 0);
|
||||
--card: oklch(0.2686 0 0);
|
||||
--card-foreground: oklch(0.9219 0 0);
|
||||
--popover: oklch(0.2686 0 0);
|
||||
--popover-foreground: oklch(0.9219 0 0);
|
||||
--primary: oklch(0.6231 0.1880 259.8145);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.2686 0 0);
|
||||
--secondary-foreground: oklch(0.9219 0 0);
|
||||
--muted: oklch(0.2393 0 0);
|
||||
--muted-foreground: oklch(0.7155 0 0);
|
||||
--accent: oklch(0.3791 0.1378 265.5222);
|
||||
--accent-foreground: oklch(0.8823 0.0571 254.1284);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3715 0 0);
|
||||
--input: oklch(0.3715 0 0);
|
||||
--ring: oklch(0.6231 0.1880 259.8145);
|
||||
--chart-1: oklch(0.7137 0.1434 254.6240);
|
||||
--chart-2: oklch(0.6231 0.1880 259.8145);
|
||||
--chart-3: oklch(0.5461 0.2152 262.8809);
|
||||
--chart-4: oklch(0.4882 0.2172 264.3763);
|
||||
--chart-5: oklch(0.4244 0.1809 265.6377);
|
||||
--sidebar: oklch(0.2046 0 0);
|
||||
--sidebar-foreground: oklch(0.9219 0 0);
|
||||
--sidebar-primary: oklch(0.6231 0.1880 259.8145);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.3791 0.1378 265.5222);
|
||||
--sidebar-accent-foreground: oklch(0.8823 0.0571 254.1284);
|
||||
--sidebar-border: oklch(0.3715 0 0);
|
||||
--sidebar-ring: oklch(0.6231 0.1880 259.8145);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.375rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/mono.css
Normal file
160
public/themes/mono.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(1.0000 0 0);
|
||||
--foreground: oklch(0.1448 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.1448 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.1448 0 0);
|
||||
--primary: oklch(0.5555 0 0);
|
||||
--primary-foreground: oklch(0.9851 0 0);
|
||||
--secondary: oklch(0.9702 0 0);
|
||||
--secondary-foreground: oklch(0.2046 0 0);
|
||||
--muted: oklch(0.9702 0 0);
|
||||
--muted-foreground: oklch(0.5486 0 0);
|
||||
--accent: oklch(0.9702 0 0);
|
||||
--accent-foreground: oklch(0.2046 0 0);
|
||||
--destructive: oklch(0.5830 0.2387 28.4765);
|
||||
--destructive-foreground: oklch(0.9702 0 0);
|
||||
--border: oklch(0.9219 0 0);
|
||||
--input: oklch(0.9219 0 0);
|
||||
--ring: oklch(0.7090 0 0);
|
||||
--chart-1: oklch(0.5555 0 0);
|
||||
--chart-2: oklch(0.5555 0 0);
|
||||
--chart-3: oklch(0.5555 0 0);
|
||||
--chart-4: oklch(0.5555 0 0);
|
||||
--chart-5: oklch(0.5555 0 0);
|
||||
--sidebar: oklch(0.9851 0 0);
|
||||
--sidebar-foreground: oklch(0.1448 0 0);
|
||||
--sidebar-primary: oklch(0.2046 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.9851 0 0);
|
||||
--sidebar-accent: oklch(0.9702 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.2046 0 0);
|
||||
--sidebar-border: oklch(0.9219 0 0);
|
||||
--sidebar-ring: oklch(0.7090 0 0);
|
||||
--font-sans: Geist Mono, monospace;
|
||||
--font-serif: Geist Mono, monospace;
|
||||
--font-mono: Geist Mono, monospace;
|
||||
--radius: 0rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 1px 0px 0px hsl(0 0% 0% / 0.00);
|
||||
--shadow-xs: 0px 1px 0px 0px hsl(0 0% 0% / 0.00);
|
||||
--shadow-sm: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 1px 2px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 1px 2px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow-md: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 2px 4px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow-lg: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 4px 6px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow-xl: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 8px 10px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow-2xl: 0px 1px 0px 0px hsl(0 0% 0% / 0.00);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1448 0 0);
|
||||
--foreground: oklch(0.9851 0 0);
|
||||
--card: oklch(0.2134 0 0);
|
||||
--card-foreground: oklch(0.9851 0 0);
|
||||
--popover: oklch(0.2686 0 0);
|
||||
--popover-foreground: oklch(0.9851 0 0);
|
||||
--primary: oklch(0.5555 0 0);
|
||||
--primary-foreground: oklch(0.9851 0 0);
|
||||
--secondary: oklch(0.2686 0 0);
|
||||
--secondary-foreground: oklch(0.9851 0 0);
|
||||
--muted: oklch(0.2686 0 0);
|
||||
--muted-foreground: oklch(0.7090 0 0);
|
||||
--accent: oklch(0.3715 0 0);
|
||||
--accent-foreground: oklch(0.9851 0 0);
|
||||
--destructive: oklch(0.7022 0.1892 22.2279);
|
||||
--destructive-foreground: oklch(0.2686 0 0);
|
||||
--border: oklch(0.3407 0 0);
|
||||
--input: oklch(0.4386 0 0);
|
||||
--ring: oklch(0.5555 0 0);
|
||||
--chart-1: oklch(0.5555 0 0);
|
||||
--chart-2: oklch(0.5555 0 0);
|
||||
--chart-3: oklch(0.5555 0 0);
|
||||
--chart-4: oklch(0.5555 0 0);
|
||||
--chart-5: oklch(0.5555 0 0);
|
||||
--sidebar: oklch(0.2046 0 0);
|
||||
--sidebar-foreground: oklch(0.9851 0 0);
|
||||
--sidebar-primary: oklch(0.9851 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.2046 0 0);
|
||||
--sidebar-accent: oklch(0.2686 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.9851 0 0);
|
||||
--sidebar-border: oklch(1.0000 0 0);
|
||||
--sidebar-ring: oklch(0.4386 0 0);
|
||||
--font-sans: Geist Mono, monospace;
|
||||
--font-serif: Geist Mono, monospace;
|
||||
--font-mono: Geist Mono, monospace;
|
||||
--radius: 0rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 1px 0px 0px hsl(0 0% 0% / 0.00);
|
||||
--shadow-xs: 0px 1px 0px 0px hsl(0 0% 0% / 0.00);
|
||||
--shadow-sm: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 1px 2px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 1px 2px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow-md: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 2px 4px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow-lg: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 4px 6px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow-xl: 0px 1px 0px 0px hsl(0 0% 0% / 0.00), 0px 8px 10px -1px hsl(0 0% 0% / 0.00);
|
||||
--shadow-2xl: 0px 1px 0px 0px hsl(0 0% 0% / 0.00);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/nature.css
Normal file
160
public/themes/nature.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9711 0.0074 80.7211);
|
||||
--foreground: oklch(0.3000 0.0358 30.2042);
|
||||
--card: oklch(0.9711 0.0074 80.7211);
|
||||
--card-foreground: oklch(0.3000 0.0358 30.2042);
|
||||
--popover: oklch(0.9711 0.0074 80.7211);
|
||||
--popover-foreground: oklch(0.3000 0.0358 30.2042);
|
||||
--primary: oklch(0.5234 0.1347 144.1672);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9571 0.0210 147.6360);
|
||||
--secondary-foreground: oklch(0.4254 0.1159 144.3078);
|
||||
--muted: oklch(0.9370 0.0142 74.4218);
|
||||
--muted-foreground: oklch(0.4495 0.0486 39.2110);
|
||||
--accent: oklch(0.8952 0.0504 146.0366);
|
||||
--accent-foreground: oklch(0.4254 0.1159 144.3078);
|
||||
--destructive: oklch(0.5386 0.1937 26.7249);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8805 0.0208 74.6428);
|
||||
--input: oklch(0.8805 0.0208 74.6428);
|
||||
--ring: oklch(0.5234 0.1347 144.1672);
|
||||
--chart-1: oklch(0.6731 0.1624 144.2083);
|
||||
--chart-2: oklch(0.5752 0.1446 144.1813);
|
||||
--chart-3: oklch(0.5234 0.1347 144.1672);
|
||||
--chart-4: oklch(0.4254 0.1159 144.3078);
|
||||
--chart-5: oklch(0.2157 0.0453 145.7256);
|
||||
--sidebar: oklch(0.9370 0.0142 74.4218);
|
||||
--sidebar-foreground: oklch(0.3000 0.0358 30.2042);
|
||||
--sidebar-primary: oklch(0.5234 0.1347 144.1672);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8952 0.0504 146.0366);
|
||||
--sidebar-accent-foreground: oklch(0.4254 0.1159 144.3078);
|
||||
--sidebar-border: oklch(0.8805 0.0208 74.6428);
|
||||
--sidebar-ring: oklch(0.5234 0.1347 144.1672);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Merriweather, serif;
|
||||
--font-mono: Source Code Pro, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2683 0.0279 150.7681);
|
||||
--foreground: oklch(0.9423 0.0097 72.6595);
|
||||
--card: oklch(0.3327 0.0271 146.9867);
|
||||
--card-foreground: oklch(0.9423 0.0097 72.6595);
|
||||
--popover: oklch(0.3327 0.0271 146.9867);
|
||||
--popover-foreground: oklch(0.9423 0.0097 72.6595);
|
||||
--primary: oklch(0.6731 0.1624 144.2083);
|
||||
--primary-foreground: oklch(0.2157 0.0453 145.7256);
|
||||
--secondary: oklch(0.3942 0.0265 142.9926);
|
||||
--secondary-foreground: oklch(0.8970 0.0166 142.5518);
|
||||
--muted: oklch(0.2926 0.0212 147.7496);
|
||||
--muted-foreground: oklch(0.8579 0.0174 76.0955);
|
||||
--accent: oklch(0.5752 0.1446 144.1813);
|
||||
--accent-foreground: oklch(0.9423 0.0097 72.6595);
|
||||
--destructive: oklch(0.5386 0.1937 26.7249);
|
||||
--destructive-foreground: oklch(0.9423 0.0097 72.6595);
|
||||
--border: oklch(0.3942 0.0265 142.9926);
|
||||
--input: oklch(0.3942 0.0265 142.9926);
|
||||
--ring: oklch(0.6731 0.1624 144.2083);
|
||||
--chart-1: oklch(0.7660 0.1179 145.2950);
|
||||
--chart-2: oklch(0.7185 0.1417 144.8887);
|
||||
--chart-3: oklch(0.6731 0.1624 144.2083);
|
||||
--chart-4: oklch(0.6291 0.1543 144.2031);
|
||||
--chart-5: oklch(0.5752 0.1446 144.1813);
|
||||
--sidebar: oklch(0.2683 0.0279 150.7681);
|
||||
--sidebar-foreground: oklch(0.9423 0.0097 72.6595);
|
||||
--sidebar-primary: oklch(0.6731 0.1624 144.2083);
|
||||
--sidebar-primary-foreground: oklch(0.2157 0.0453 145.7256);
|
||||
--sidebar-accent: oklch(0.5752 0.1446 144.1813);
|
||||
--sidebar-accent-foreground: oklch(0.9423 0.0097 72.6595);
|
||||
--sidebar-border: oklch(0.3942 0.0265 142.9926);
|
||||
--sidebar-ring: oklch(0.6731 0.1624 144.2083);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Merriweather, serif;
|
||||
--font-mono: Source Code Pro, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/neo.css
Normal file
160
public/themes/neo.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(1.0000 0 0);
|
||||
--foreground: oklch(0 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0 0 0);
|
||||
--primary: oklch(0.6489 0.2370 26.9728);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9680 0.2110 109.7692);
|
||||
--secondary-foreground: oklch(0 0 0);
|
||||
--muted: oklch(0.9551 0 0);
|
||||
--muted-foreground: oklch(0.3211 0 0);
|
||||
--accent: oklch(0.5635 0.2408 260.8178);
|
||||
--accent-foreground: oklch(1.0000 0 0);
|
||||
--destructive: oklch(0 0 0);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0 0 0);
|
||||
--input: oklch(0 0 0);
|
||||
--ring: oklch(0.6489 0.2370 26.9728);
|
||||
--chart-1: oklch(0.6489 0.2370 26.9728);
|
||||
--chart-2: oklch(0.9680 0.2110 109.7692);
|
||||
--chart-3: oklch(0.5635 0.2408 260.8178);
|
||||
--chart-4: oklch(0.7323 0.2492 142.4953);
|
||||
--chart-5: oklch(0.5931 0.2726 328.3634);
|
||||
--sidebar: oklch(0.9551 0 0);
|
||||
--sidebar-foreground: oklch(0 0 0);
|
||||
--sidebar-primary: oklch(0.6489 0.2370 26.9728);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.5635 0.2408 260.8178);
|
||||
--sidebar-accent-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-border: oklch(0 0 0);
|
||||
--sidebar-ring: oklch(0.6489 0.2370 26.9728);
|
||||
--font-sans: DM Sans, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: Space Mono, monospace;
|
||||
--radius: 0px;
|
||||
--shadow-x: 4px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 4px 4px 0px 0px hsl(0 0% 0% / 0.50);
|
||||
--shadow-xs: 4px 4px 0px 0px hsl(0 0% 0% / 0.50);
|
||||
--shadow-sm: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 1px 2px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 1px 2px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow-md: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 2px 4px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow-lg: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 4px 6px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow-xl: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 8px 10px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow-2xl: 4px 4px 0px 0px hsl(0 0% 0% / 2.50);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0 0 0);
|
||||
--foreground: oklch(1.0000 0 0);
|
||||
--card: oklch(0.3211 0 0);
|
||||
--card-foreground: oklch(1.0000 0 0);
|
||||
--popover: oklch(0.3211 0 0);
|
||||
--popover-foreground: oklch(1.0000 0 0);
|
||||
--primary: oklch(0.7044 0.1872 23.1858);
|
||||
--primary-foreground: oklch(0 0 0);
|
||||
--secondary: oklch(0.9691 0.2005 109.6228);
|
||||
--secondary-foreground: oklch(0 0 0);
|
||||
--muted: oklch(0.2178 0 0);
|
||||
--muted-foreground: oklch(0.8452 0 0);
|
||||
--accent: oklch(0.6755 0.1765 252.2592);
|
||||
--accent-foreground: oklch(0 0 0);
|
||||
--destructive: oklch(1.0000 0 0);
|
||||
--destructive-foreground: oklch(0 0 0);
|
||||
--border: oklch(1.0000 0 0);
|
||||
--input: oklch(1.0000 0 0);
|
||||
--ring: oklch(0.7044 0.1872 23.1858);
|
||||
--chart-1: oklch(0.7044 0.1872 23.1858);
|
||||
--chart-2: oklch(0.9691 0.2005 109.6228);
|
||||
--chart-3: oklch(0.6755 0.1765 252.2592);
|
||||
--chart-4: oklch(0.7395 0.2268 142.8504);
|
||||
--chart-5: oklch(0.6131 0.2458 328.0714);
|
||||
--sidebar: oklch(0 0 0);
|
||||
--sidebar-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-primary: oklch(0.7044 0.1872 23.1858);
|
||||
--sidebar-primary-foreground: oklch(0 0 0);
|
||||
--sidebar-accent: oklch(0.6755 0.1765 252.2592);
|
||||
--sidebar-accent-foreground: oklch(0 0 0);
|
||||
--sidebar-border: oklch(1.0000 0 0);
|
||||
--sidebar-ring: oklch(0.7044 0.1872 23.1858);
|
||||
--font-sans: DM Sans, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: Space Mono, monospace;
|
||||
--radius: 0px;
|
||||
--shadow-x: 4px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 4px 4px 0px 0px hsl(0 0% 0% / 0.50);
|
||||
--shadow-xs: 4px 4px 0px 0px hsl(0 0% 0% / 0.50);
|
||||
--shadow-sm: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 1px 2px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 1px 2px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow-md: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 2px 4px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow-lg: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 4px 6px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow-xl: 4px 4px 0px 0px hsl(0 0% 0% / 1.00), 4px 8px 10px -1px hsl(0 0% 0% / 1.00);
|
||||
--shadow-2xl: 4px 4px 0px 0px hsl(0 0% 0% / 2.50);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/northern.css
Normal file
160
public/themes/northern.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9824 0.0013 286.3757);
|
||||
--foreground: oklch(0.3211 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3211 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3211 0 0);
|
||||
--primary: oklch(0.6487 0.1538 150.3071);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.6746 0.1414 261.3380);
|
||||
--secondary-foreground: oklch(1.0000 0 0);
|
||||
--muted: oklch(0.8828 0.0285 98.1033);
|
||||
--muted-foreground: oklch(0.5382 0 0);
|
||||
--accent: oklch(0.8269 0.1080 211.9627);
|
||||
--accent-foreground: oklch(0.3211 0 0);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8699 0 0);
|
||||
--input: oklch(0.8699 0 0);
|
||||
--ring: oklch(0.6487 0.1538 150.3071);
|
||||
--chart-1: oklch(0.6487 0.1538 150.3071);
|
||||
--chart-2: oklch(0.6746 0.1414 261.3380);
|
||||
--chart-3: oklch(0.8269 0.1080 211.9627);
|
||||
--chart-4: oklch(0.5880 0.0993 245.7394);
|
||||
--chart-5: oklch(0.5905 0.1608 148.2409);
|
||||
--sidebar: oklch(0.9824 0.0013 286.3757);
|
||||
--sidebar-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-primary: oklch(0.6487 0.1538 150.3071);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8269 0.1080 211.9627);
|
||||
--sidebar-accent-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-border: oklch(0.8699 0 0);
|
||||
--sidebar-ring: oklch(0.6487 0.1538 150.3071);
|
||||
--font-sans: Plus Jakarta Sans, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2303 0.0125 264.2926);
|
||||
--foreground: oklch(0.9219 0 0);
|
||||
--card: oklch(0.3210 0.0078 223.6661);
|
||||
--card-foreground: oklch(0.9219 0 0);
|
||||
--popover: oklch(0.3210 0.0078 223.6661);
|
||||
--popover-foreground: oklch(0.9219 0 0);
|
||||
--primary: oklch(0.6487 0.1538 150.3071);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.5880 0.0993 245.7394);
|
||||
--secondary-foreground: oklch(0.9219 0 0);
|
||||
--muted: oklch(0.3867 0 0);
|
||||
--muted-foreground: oklch(0.7155 0 0);
|
||||
--accent: oklch(0.6746 0.1414 261.3380);
|
||||
--accent-foreground: oklch(0.9219 0 0);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3867 0 0);
|
||||
--input: oklch(0.3867 0 0);
|
||||
--ring: oklch(0.6487 0.1538 150.3071);
|
||||
--chart-1: oklch(0.6487 0.1538 150.3071);
|
||||
--chart-2: oklch(0.5880 0.0993 245.7394);
|
||||
--chart-3: oklch(0.6746 0.1414 261.3380);
|
||||
--chart-4: oklch(0.8269 0.1080 211.9627);
|
||||
--chart-5: oklch(0.5905 0.1608 148.2409);
|
||||
--sidebar: oklch(0.2303 0.0125 264.2926);
|
||||
--sidebar-foreground: oklch(0.9219 0 0);
|
||||
--sidebar-primary: oklch(0.6487 0.1538 150.3071);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.6746 0.1414 261.3380);
|
||||
--sidebar-accent-foreground: oklch(0.9219 0 0);
|
||||
--sidebar-border: oklch(0.3867 0 0);
|
||||
--sidebar-ring: oklch(0.6487 0.1538 150.3071);
|
||||
--font-sans: Plus Jakarta Sans, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
171
public/themes/notebook.css
Normal file
171
public/themes/notebook.css
Normal file
@ -0,0 +1,171 @@
|
||||
:root {
|
||||
--background: oklch(0.9821 0 0);
|
||||
--foreground: oklch(0.3485 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3485 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3485 0 0);
|
||||
--primary: oklch(0.4891 0 0);
|
||||
--primary-foreground: oklch(0.9551 0 0);
|
||||
--secondary: oklch(0.9006 0 0);
|
||||
--secondary-foreground: oklch(0.3485 0 0);
|
||||
--muted: oklch(0.9158 0 0);
|
||||
--muted-foreground: oklch(0.4313 0 0);
|
||||
--accent: oklch(0.9354 0.0456 94.8549);
|
||||
--accent-foreground: oklch(0.4015 0.0436 37.9587);
|
||||
--destructive: oklch(0.6627 0.0978 20.0041);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.5538 0.0025 17.2320);
|
||||
--input: oklch(1.0000 0 0);
|
||||
--ring: oklch(0.7058 0 0);
|
||||
--chart-1: oklch(0.3211 0 0);
|
||||
--chart-2: oklch(0.4495 0 0);
|
||||
--chart-3: oklch(0.5693 0 0);
|
||||
--chart-4: oklch(0.6830 0 0);
|
||||
--chart-5: oklch(0.7921 0 0);
|
||||
--sidebar: oklch(0.9551 0 0);
|
||||
--sidebar-foreground: oklch(0.3485 0 0);
|
||||
--sidebar-primary: oklch(0.4891 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.9551 0 0);
|
||||
--sidebar-accent: oklch(0.9354 0.0456 94.8549);
|
||||
--sidebar-accent-foreground: oklch(0.4015 0.0436 37.9587);
|
||||
--sidebar-border: oklch(0.8078 0 0);
|
||||
--sidebar-ring: oklch(0.7058 0 0);
|
||||
--font-sans: Architects Daughter, sans-serif;
|
||||
--font-serif: "Times New Roman", Times, serif;
|
||||
--font-mono: "Courier New", Courier, monospace;
|
||||
--radius: 0.625rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 5px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.03;
|
||||
--shadow-color: #000000;
|
||||
--shadow-2xs: 1px 4px 5px 0px hsl(0 0% 0% / 0.01);
|
||||
--shadow-xs: 1px 4px 5px 0px hsl(0 0% 0% / 0.01);
|
||||
--shadow-sm: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 1px 2px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 1px 2px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-md: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 2px 4px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-lg: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 4px 6px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-xl: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 8px 10px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-2xl: 1px 4px 5px 0px hsl(0 0% 0% / 0.07);
|
||||
--tracking-normal: 0.5px;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2891 0 0);
|
||||
--foreground: oklch(0.8945 0 0);
|
||||
--card: oklch(0.3211 0 0);
|
||||
--card-foreground: oklch(0.8945 0 0);
|
||||
--popover: oklch(0.3211 0 0);
|
||||
--popover-foreground: oklch(0.8945 0 0);
|
||||
--primary: oklch(0.7572 0 0);
|
||||
--primary-foreground: oklch(0.2891 0 0);
|
||||
--secondary: oklch(0.4676 0 0);
|
||||
--secondary-foreground: oklch(0.8078 0 0);
|
||||
--muted: oklch(0.3904 0 0);
|
||||
--muted-foreground: oklch(0.7058 0 0);
|
||||
--accent: oklch(0.9067 0 0);
|
||||
--accent-foreground: oklch(0.3211 0 0);
|
||||
--destructive: oklch(0.7915 0.0491 18.2410);
|
||||
--destructive-foreground: oklch(0.2891 0 0);
|
||||
--border: oklch(0.4276 0 0);
|
||||
--input: oklch(0.3211 0 0);
|
||||
--ring: oklch(0.8078 0 0);
|
||||
--chart-1: oklch(0.9521 0 0);
|
||||
--chart-2: oklch(0.8576 0 0);
|
||||
--chart-3: oklch(0.7572 0 0);
|
||||
--chart-4: oklch(0.6534 0 0);
|
||||
--chart-5: oklch(0.5452 0 0);
|
||||
--sidebar: oklch(0.2478 0 0);
|
||||
--sidebar-foreground: oklch(0.8945 0 0);
|
||||
--sidebar-primary: oklch(0.7572 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.2478 0 0);
|
||||
--sidebar-accent: oklch(0.9067 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-border: oklch(0.4276 0 0);
|
||||
--sidebar-ring: oklch(0.8078 0 0);
|
||||
--font-sans: Architects Daughter, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: "Fira Code", "Courier New", monospace;
|
||||
--radius: 0.625rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 5px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.03;
|
||||
--shadow-color: #000000;
|
||||
--shadow-2xs: 1px 4px 5px 0px hsl(0 0% 0% / 0.01);
|
||||
--shadow-xs: 1px 4px 5px 0px hsl(0 0% 0% / 0.01);
|
||||
--shadow-sm: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 1px 2px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 1px 2px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-md: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 2px 4px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-lg: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 4px 6px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-xl: 1px 4px 5px 0px hsl(0 0% 0% / 0.03), 1px 8px 10px -1px hsl(0 0% 0% / 0.03);
|
||||
--shadow-2xl: 1px 4px 5px 0px hsl(0 0% 0% / 0.07);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
|
||||
--tracking-tighter: calc(var(--tracking-normal) - 0.05em);
|
||||
--tracking-tight: calc(var(--tracking-normal) - 0.025em);
|
||||
--tracking-normal: var(--tracking-normal);
|
||||
--tracking-wide: calc(var(--tracking-normal) + 0.025em);
|
||||
--tracking-wider: calc(var(--tracking-normal) + 0.05em);
|
||||
--tracking-widest: calc(var(--tracking-normal) + 0.1em);
|
||||
}
|
||||
|
||||
body {
|
||||
letter-spacing: var(--tracking-normal);
|
||||
}
|
||||
160
public/themes/ocean.css
Normal file
160
public/themes/ocean.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9751 0.0127 244.2507);
|
||||
--foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--primary: oklch(0.7227 0.1920 149.5793);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9514 0.0250 236.8242);
|
||||
--secondary-foreground: oklch(0.4461 0.0263 256.8018);
|
||||
--muted: oklch(0.9670 0.0029 264.5419);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.9505 0.0507 163.0508);
|
||||
--accent-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9276 0.0058 264.5313);
|
||||
--input: oklch(0.9276 0.0058 264.5313);
|
||||
--ring: oklch(0.7227 0.1920 149.5793);
|
||||
--chart-1: oklch(0.7227 0.1920 149.5793);
|
||||
--chart-2: oklch(0.6959 0.1491 162.4796);
|
||||
--chart-3: oklch(0.5960 0.1274 163.2254);
|
||||
--chart-4: oklch(0.5081 0.1049 165.6121);
|
||||
--chart-5: oklch(0.4318 0.0865 166.9128);
|
||||
--sidebar: oklch(0.9514 0.0250 236.8242);
|
||||
--sidebar-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-primary: oklch(0.7227 0.1920 149.5793);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9505 0.0507 163.0508);
|
||||
--sidebar-accent-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-border: oklch(0.9276 0.0058 264.5313);
|
||||
--sidebar-ring: oklch(0.7227 0.1920 149.5793);
|
||||
--font-sans: DM Sans, sans-serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 8px;
|
||||
--shadow-spread: -1px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 2px 4px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 4px 6px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 8px 10px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2077 0.0398 265.7549);
|
||||
--foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--card: oklch(0.2795 0.0368 260.0310);
|
||||
--card-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--popover: oklch(0.2795 0.0368 260.0310);
|
||||
--popover-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--primary: oklch(0.7729 0.1535 163.2231);
|
||||
--primary-foreground: oklch(0.2077 0.0398 265.7549);
|
||||
--secondary: oklch(0.3351 0.0331 260.9120);
|
||||
--secondary-foreground: oklch(0.7118 0.0129 286.0665);
|
||||
--muted: oklch(0.2463 0.0275 259.9628);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.3729 0.0306 259.7328);
|
||||
--accent-foreground: oklch(0.7118 0.0129 286.0665);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(0.2077 0.0398 265.7549);
|
||||
--border: oklch(0.4461 0.0263 256.8018);
|
||||
--input: oklch(0.4461 0.0263 256.8018);
|
||||
--ring: oklch(0.7729 0.1535 163.2231);
|
||||
--chart-1: oklch(0.7729 0.1535 163.2231);
|
||||
--chart-2: oklch(0.7845 0.1325 181.9120);
|
||||
--chart-3: oklch(0.7227 0.1920 149.5793);
|
||||
--chart-4: oklch(0.6959 0.1491 162.4796);
|
||||
--chart-5: oklch(0.5960 0.1274 163.2254);
|
||||
--sidebar: oklch(0.2795 0.0368 260.0310);
|
||||
--sidebar-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--sidebar-primary: oklch(0.7729 0.1535 163.2231);
|
||||
--sidebar-primary-foreground: oklch(0.2077 0.0398 265.7549);
|
||||
--sidebar-accent: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-accent-foreground: oklch(0.7118 0.0129 286.0665);
|
||||
--sidebar-border: oklch(0.4461 0.0263 256.8018);
|
||||
--sidebar-ring: oklch(0.7729 0.1535 163.2231);
|
||||
--font-sans: DM Sans, sans-serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 4px;
|
||||
--shadow-blur: 8px;
|
||||
--shadow-spread: -1px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 2px 4px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 4px 6px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 8px 10px -2px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/pastel.css
Normal file
160
public/themes/pastel.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9689 0.0090 314.7819);
|
||||
--foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--primary: oklch(0.7090 0.1592 293.5412);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9073 0.0530 306.0902);
|
||||
--secondary-foreground: oklch(0.4461 0.0263 256.8018);
|
||||
--muted: oklch(0.9464 0.0327 307.1745);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.9376 0.0260 321.9388);
|
||||
--accent-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--destructive: oklch(0.8077 0.1035 19.5706);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9073 0.0530 306.0902);
|
||||
--input: oklch(0.9073 0.0530 306.0902);
|
||||
--ring: oklch(0.7090 0.1592 293.5412);
|
||||
--chart-1: oklch(0.7090 0.1592 293.5412);
|
||||
--chart-2: oklch(0.6056 0.2189 292.7172);
|
||||
--chart-3: oklch(0.5413 0.2466 293.0090);
|
||||
--chart-4: oklch(0.4907 0.2412 292.5809);
|
||||
--chart-5: oklch(0.4320 0.2106 292.7591);
|
||||
--sidebar: oklch(0.9073 0.0530 306.0902);
|
||||
--sidebar-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-primary: oklch(0.7090 0.1592 293.5412);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9376 0.0260 321.9388);
|
||||
--sidebar-accent-foreground: oklch(0.3729 0.0306 259.7328);
|
||||
--sidebar-border: oklch(0.9073 0.0530 306.0902);
|
||||
--sidebar-ring: oklch(0.7090 0.1592 293.5412);
|
||||
--font-sans: Open Sans, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 1.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 8px;
|
||||
--shadow-blur: 16px;
|
||||
--shadow-spread: -4px;
|
||||
--shadow-opacity: 0.08;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 8px 16px -4px hsl(0 0% 0% / 0.04);
|
||||
--shadow-xs: 0px 8px 16px -4px hsl(0 0% 0% / 0.04);
|
||||
--shadow-sm: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 1px 2px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 1px 2px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow-md: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 2px 4px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow-lg: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 4px 6px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow-xl: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 8px 10px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow-2xl: 0px 8px 16px -4px hsl(0 0% 0% / 0.20);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2161 0.0061 56.0434);
|
||||
--foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--card: oklch(0.2805 0.0309 307.2326);
|
||||
--card-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--popover: oklch(0.2805 0.0309 307.2326);
|
||||
--popover-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--primary: oklch(0.7874 0.1179 295.7538);
|
||||
--primary-foreground: oklch(0.2161 0.0061 56.0434);
|
||||
--secondary: oklch(0.3416 0.0444 308.8496);
|
||||
--secondary-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--muted: oklch(0.2283 0.0375 302.9006);
|
||||
--muted-foreground: oklch(0.7137 0.0192 261.3246);
|
||||
--accent: oklch(0.3858 0.0509 304.6383);
|
||||
--accent-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--destructive: oklch(0.8077 0.1035 19.5706);
|
||||
--destructive-foreground: oklch(0.2161 0.0061 56.0434);
|
||||
--border: oklch(0.3416 0.0444 308.8496);
|
||||
--input: oklch(0.3416 0.0444 308.8496);
|
||||
--ring: oklch(0.7874 0.1179 295.7538);
|
||||
--chart-1: oklch(0.7874 0.1179 295.7538);
|
||||
--chart-2: oklch(0.7090 0.1592 293.5412);
|
||||
--chart-3: oklch(0.6056 0.2189 292.7172);
|
||||
--chart-4: oklch(0.5413 0.2466 293.0090);
|
||||
--chart-5: oklch(0.4907 0.2412 292.5809);
|
||||
--sidebar: oklch(0.3416 0.0444 308.8496);
|
||||
--sidebar-foreground: oklch(0.9299 0.0334 272.7879);
|
||||
--sidebar-primary: oklch(0.7874 0.1179 295.7538);
|
||||
--sidebar-primary-foreground: oklch(0.2161 0.0061 56.0434);
|
||||
--sidebar-accent: oklch(0.3858 0.0509 304.6383);
|
||||
--sidebar-accent-foreground: oklch(0.8717 0.0093 258.3382);
|
||||
--sidebar-border: oklch(0.3416 0.0444 308.8496);
|
||||
--sidebar-ring: oklch(0.7874 0.1179 295.7538);
|
||||
--font-sans: Open Sans, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 1.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 8px;
|
||||
--shadow-blur: 16px;
|
||||
--shadow-spread: -4px;
|
||||
--shadow-opacity: 0.08;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 8px 16px -4px hsl(0 0% 0% / 0.04);
|
||||
--shadow-xs: 0px 8px 16px -4px hsl(0 0% 0% / 0.04);
|
||||
--shadow-sm: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 1px 2px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 1px 2px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow-md: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 2px 4px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow-lg: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 4px 6px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow-xl: 0px 8px 16px -4px hsl(0 0% 0% / 0.08), 0px 8px 10px -5px hsl(0 0% 0% / 0.08);
|
||||
--shadow-2xl: 0px 8px 16px -4px hsl(0 0% 0% / 0.20);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/perpetuity.css
Normal file
160
public/themes/perpetuity.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9491 0.0085 197.0126);
|
||||
--foreground: oklch(0.3772 0.0619 212.6640);
|
||||
--card: oklch(0.9724 0.0053 197.0692);
|
||||
--card-foreground: oklch(0.3772 0.0619 212.6640);
|
||||
--popover: oklch(0.9724 0.0053 197.0692);
|
||||
--popover-foreground: oklch(0.3772 0.0619 212.6640);
|
||||
--primary: oklch(0.5624 0.0947 203.2755);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9244 0.0181 196.8450);
|
||||
--secondary-foreground: oklch(0.3772 0.0619 212.6640);
|
||||
--muted: oklch(0.9295 0.0107 196.9723);
|
||||
--muted-foreground: oklch(0.5428 0.0594 201.5662);
|
||||
--accent: oklch(0.9021 0.0297 201.8915);
|
||||
--accent-foreground: oklch(0.3772 0.0619 212.6640);
|
||||
--destructive: oklch(0.5732 0.1901 25.5409);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8931 0.0205 204.4136);
|
||||
--input: oklch(0.9244 0.0181 196.8450);
|
||||
--ring: oklch(0.5624 0.0947 203.2755);
|
||||
--chart-1: oklch(0.5624 0.0947 203.2755);
|
||||
--chart-2: oklch(0.6389 0.1029 201.5918);
|
||||
--chart-3: oklch(0.7124 0.1075 201.2486);
|
||||
--chart-4: oklch(0.7701 0.0979 201.1816);
|
||||
--chart-5: oklch(0.8336 0.0771 200.9702);
|
||||
--sidebar: oklch(0.9280 0.0183 205.3151);
|
||||
--sidebar-foreground: oklch(0.3772 0.0619 212.6640);
|
||||
--sidebar-primary: oklch(0.5624 0.0947 203.2755);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9021 0.0297 201.8915);
|
||||
--sidebar-accent-foreground: oklch(0.3772 0.0619 212.6640);
|
||||
--sidebar-border: oklch(0.8931 0.0205 204.4136);
|
||||
--sidebar-ring: oklch(0.5624 0.0947 203.2755);
|
||||
--font-sans: Courier New, monospace;
|
||||
--font-serif: Courier New, monospace;
|
||||
--font-mono: Courier New, monospace;
|
||||
--radius: 0.125rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 2px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.15;
|
||||
--shadow-color: hsl(185 70% 30% / 0.15);
|
||||
--shadow-2xs: 1px 1px 2px 0px hsl(185 70% 30% / 0.07);
|
||||
--shadow-xs: 1px 1px 2px 0px hsl(185 70% 30% / 0.07);
|
||||
--shadow-sm: 1px 1px 2px 0px hsl(185 70% 30% / 0.15), 1px 1px 2px -1px hsl(185 70% 30% / 0.15);
|
||||
--shadow: 1px 1px 2px 0px hsl(185 70% 30% / 0.15), 1px 1px 2px -1px hsl(185 70% 30% / 0.15);
|
||||
--shadow-md: 1px 1px 2px 0px hsl(185 70% 30% / 0.15), 1px 2px 4px -1px hsl(185 70% 30% / 0.15);
|
||||
--shadow-lg: 1px 1px 2px 0px hsl(185 70% 30% / 0.15), 1px 4px 6px -1px hsl(185 70% 30% / 0.15);
|
||||
--shadow-xl: 1px 1px 2px 0px hsl(185 70% 30% / 0.15), 1px 8px 10px -1px hsl(185 70% 30% / 0.15);
|
||||
--shadow-2xl: 1px 1px 2px 0px hsl(185 70% 30% / 0.38);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2068 0.0247 224.4533);
|
||||
--foreground: oklch(0.8520 0.1269 195.0354);
|
||||
--card: oklch(0.2293 0.0276 216.0674);
|
||||
--card-foreground: oklch(0.8520 0.1269 195.0354);
|
||||
--popover: oklch(0.2293 0.0276 216.0674);
|
||||
--popover-foreground: oklch(0.8520 0.1269 195.0354);
|
||||
--primary: oklch(0.8520 0.1269 195.0354);
|
||||
--primary-foreground: oklch(0.2068 0.0247 224.4533);
|
||||
--secondary: oklch(0.3775 0.0564 216.5010);
|
||||
--secondary-foreground: oklch(0.8520 0.1269 195.0354);
|
||||
--muted: oklch(0.2894 0.0412 218.8153);
|
||||
--muted-foreground: oklch(0.6611 0.0975 195.0526);
|
||||
--accent: oklch(0.3775 0.0564 216.5010);
|
||||
--accent-foreground: oklch(0.8520 0.1269 195.0354);
|
||||
--destructive: oklch(0.6168 0.2086 25.8088);
|
||||
--destructive-foreground: oklch(0.9612 0 0);
|
||||
--border: oklch(0.3775 0.0564 216.5010);
|
||||
--input: oklch(0.3775 0.0564 216.5010);
|
||||
--ring: oklch(0.8520 0.1269 195.0354);
|
||||
--chart-1: oklch(0.8520 0.1269 195.0354);
|
||||
--chart-2: oklch(0.6611 0.0975 195.0526);
|
||||
--chart-3: oklch(0.5804 0.0849 195.0673);
|
||||
--chart-4: oklch(0.4269 0.0630 202.6247);
|
||||
--chart-5: oklch(0.3142 0.0455 204.1575);
|
||||
--sidebar: oklch(0.2068 0.0247 224.4533);
|
||||
--sidebar-foreground: oklch(0.8520 0.1269 195.0354);
|
||||
--sidebar-primary: oklch(0.8520 0.1269 195.0354);
|
||||
--sidebar-primary-foreground: oklch(0.2068 0.0247 224.4533);
|
||||
--sidebar-accent: oklch(0.3775 0.0564 216.5010);
|
||||
--sidebar-accent-foreground: oklch(0.8520 0.1269 195.0354);
|
||||
--sidebar-border: oklch(0.3775 0.0564 216.5010);
|
||||
--sidebar-ring: oklch(0.8520 0.1269 195.0354);
|
||||
--font-sans: Source Code Pro, monospace;
|
||||
--font-serif: Source Code Pro, monospace;
|
||||
--font-mono: Source Code Pro, monospace;
|
||||
--radius: 0.125rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 2px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.2;
|
||||
--shadow-color: hsl(180 70% 60% / 0.2);
|
||||
--shadow-2xs: 1px 1px 2px 0px hsl(180 70% 60% / 0.10);
|
||||
--shadow-xs: 1px 1px 2px 0px hsl(180 70% 60% / 0.10);
|
||||
--shadow-sm: 1px 1px 2px 0px hsl(180 70% 60% / 0.20), 1px 1px 2px -1px hsl(180 70% 60% / 0.20);
|
||||
--shadow: 1px 1px 2px 0px hsl(180 70% 60% / 0.20), 1px 1px 2px -1px hsl(180 70% 60% / 0.20);
|
||||
--shadow-md: 1px 1px 2px 0px hsl(180 70% 60% / 0.20), 1px 2px 4px -1px hsl(180 70% 60% / 0.20);
|
||||
--shadow-lg: 1px 1px 2px 0px hsl(180 70% 60% / 0.20), 1px 4px 6px -1px hsl(180 70% 60% / 0.20);
|
||||
--shadow-xl: 1px 1px 2px 0px hsl(180 70% 60% / 0.20), 1px 8px 10px -1px hsl(180 70% 60% / 0.20);
|
||||
--shadow-2xl: 1px 1px 2px 0px hsl(180 70% 60% / 0.50);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/quantum.css
Normal file
160
public/themes/quantum.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9692 0.0192 343.9344);
|
||||
--foreground: oklch(0.4426 0.1653 352.3762);
|
||||
--card: oklch(0.9837 0.0107 339.3288);
|
||||
--card-foreground: oklch(0.4426 0.1653 352.3762);
|
||||
--popover: oklch(0.9837 0.0107 339.3288);
|
||||
--popover-foreground: oklch(0.4426 0.1653 352.3762);
|
||||
--primary: oklch(0.6002 0.2414 0.1348);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9230 0.0701 326.1273);
|
||||
--secondary-foreground: oklch(0.4426 0.1653 352.3762);
|
||||
--muted: oklch(0.9429 0.0363 344.2604);
|
||||
--muted-foreground: oklch(0.5740 0.1732 352.0544);
|
||||
--accent: oklch(0.8766 0.0828 344.8849);
|
||||
--accent-foreground: oklch(0.4426 0.1653 352.3762);
|
||||
--destructive: oklch(0.5831 0.1911 6.3410);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8881 0.0747 344.3866);
|
||||
--input: oklch(0.9230 0.0701 326.1273);
|
||||
--ring: oklch(0.6002 0.2414 0.1348);
|
||||
--chart-1: oklch(0.6002 0.2414 0.1348);
|
||||
--chart-2: oklch(0.5979 0.1750 345.0378);
|
||||
--chart-3: oklch(0.6009 0.1243 311.7958);
|
||||
--chart-4: oklch(0.5849 0.1178 283.2937);
|
||||
--chart-5: oklch(0.6479 0.1871 267.9684);
|
||||
--sidebar: oklch(0.9629 0.0227 345.7485);
|
||||
--sidebar-foreground: oklch(0.4426 0.1653 352.3762);
|
||||
--sidebar-primary: oklch(0.6002 0.2414 0.1348);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8766 0.0828 344.8849);
|
||||
--sidebar-accent-foreground: oklch(0.4426 0.1653 352.3762);
|
||||
--sidebar-border: oklch(0.9311 0.0448 343.3135);
|
||||
--sidebar-ring: oklch(0.6002 0.2414 0.1348);
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: Playfair Display, serif;
|
||||
--font-mono: Space Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 3px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.18;
|
||||
--shadow-color: hsl(330 70% 30% / 0.12);
|
||||
--shadow-2xs: 0px 3px 0px 0px hsl(330 70% 30% / 0.09);
|
||||
--shadow-xs: 0px 3px 0px 0px hsl(330 70% 30% / 0.09);
|
||||
--shadow-sm: 0px 3px 0px 0px hsl(330 70% 30% / 0.18), 0px 1px 2px -1px hsl(330 70% 30% / 0.18);
|
||||
--shadow: 0px 3px 0px 0px hsl(330 70% 30% / 0.18), 0px 1px 2px -1px hsl(330 70% 30% / 0.18);
|
||||
--shadow-md: 0px 3px 0px 0px hsl(330 70% 30% / 0.18), 0px 2px 4px -1px hsl(330 70% 30% / 0.18);
|
||||
--shadow-lg: 0px 3px 0px 0px hsl(330 70% 30% / 0.18), 0px 4px 6px -1px hsl(330 70% 30% / 0.18);
|
||||
--shadow-xl: 0px 3px 0px 0px hsl(330 70% 30% / 0.18), 0px 8px 10px -1px hsl(330 70% 30% / 0.18);
|
||||
--shadow-2xl: 0px 3px 0px 0px hsl(330 70% 30% / 0.45);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1808 0.0535 313.7159);
|
||||
--foreground: oklch(0.8624 0.1307 326.6356);
|
||||
--card: oklch(0.2398 0.0661 313.2337);
|
||||
--card-foreground: oklch(0.8624 0.1307 326.6356);
|
||||
--popover: oklch(0.2398 0.0661 313.2337);
|
||||
--popover-foreground: oklch(0.8624 0.1307 326.6356);
|
||||
--primary: oklch(0.7543 0.2319 332.0212);
|
||||
--primary-foreground: oklch(0.1608 0.0493 327.5673);
|
||||
--secondary: oklch(0.3184 0.0915 319.6465);
|
||||
--secondary-foreground: oklch(0.8624 0.1307 326.6356);
|
||||
--muted: oklch(0.2701 0.0770 312.3525);
|
||||
--muted-foreground: oklch(0.7116 0.1623 327.1132);
|
||||
--accent: oklch(0.3558 0.1201 325.7655);
|
||||
--accent-foreground: oklch(0.8624 0.1307 326.6356);
|
||||
--destructive: oklch(0.6539 0.2441 7.1740);
|
||||
--destructive-foreground: oklch(0.9821 0 0);
|
||||
--border: oklch(0.3280 0.1202 313.5393);
|
||||
--input: oklch(0.3184 0.0915 319.6465);
|
||||
--ring: oklch(0.7543 0.2319 332.0212);
|
||||
--chart-1: oklch(0.7543 0.2319 332.0212);
|
||||
--chart-2: oklch(0.6508 0.2159 317.6331);
|
||||
--chart-3: oklch(0.6249 0.2233 292.7656);
|
||||
--chart-4: oklch(0.6067 0.1649 278.7172);
|
||||
--chart-5: oklch(0.6235 0.2019 268.0521);
|
||||
--sidebar: oklch(0.1941 0.0504 311.3983);
|
||||
--sidebar-foreground: oklch(0.8624 0.1307 326.6356);
|
||||
--sidebar-primary: oklch(0.7543 0.2319 332.0212);
|
||||
--sidebar-primary-foreground: oklch(0.1608 0.0493 327.5673);
|
||||
--sidebar-accent: oklch(0.3558 0.1201 325.7655);
|
||||
--sidebar-accent-foreground: oklch(0.8624 0.1307 326.6356);
|
||||
--sidebar-border: oklch(0.3280 0.1202 313.5393);
|
||||
--sidebar-ring: oklch(0.7543 0.2319 332.0212);
|
||||
--font-sans: Quicksand, sans-serif;
|
||||
--font-serif: Playfair Display, serif;
|
||||
--font-mono: Space Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 3px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.18;
|
||||
--shadow-color: hsl(300 80% 50% / 0.25);
|
||||
--shadow-2xs: 0px 3px 0px 0px hsl(300 80% 50% / 0.09);
|
||||
--shadow-xs: 0px 3px 0px 0px hsl(300 80% 50% / 0.09);
|
||||
--shadow-sm: 0px 3px 0px 0px hsl(300 80% 50% / 0.18), 0px 1px 2px -1px hsl(300 80% 50% / 0.18);
|
||||
--shadow: 0px 3px 0px 0px hsl(300 80% 50% / 0.18), 0px 1px 2px -1px hsl(300 80% 50% / 0.18);
|
||||
--shadow-md: 0px 3px 0px 0px hsl(300 80% 50% / 0.18), 0px 2px 4px -1px hsl(300 80% 50% / 0.18);
|
||||
--shadow-lg: 0px 3px 0px 0px hsl(300 80% 50% / 0.18), 0px 4px 6px -1px hsl(300 80% 50% / 0.18);
|
||||
--shadow-xl: 0px 3px 0px 0px hsl(300 80% 50% / 0.18), 0px 8px 10px -1px hsl(300 80% 50% / 0.18);
|
||||
--shadow-2xl: 0px 3px 0px 0px hsl(300 80% 50% / 0.45);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/retro.css
Normal file
160
public/themes/retro.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9735 0.0261 90.0953);
|
||||
--foreground: oklch(0.3092 0.0518 219.6516);
|
||||
--card: oklch(0.9306 0.0260 92.4020);
|
||||
--card-foreground: oklch(0.3092 0.0518 219.6516);
|
||||
--popover: oklch(0.9306 0.0260 92.4020);
|
||||
--popover-foreground: oklch(0.3092 0.0518 219.6516);
|
||||
--primary: oklch(0.5924 0.2025 355.8943);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.6437 0.1019 187.3840);
|
||||
--secondary-foreground: oklch(1.0000 0 0);
|
||||
--muted: oklch(0.6979 0.0159 196.7940);
|
||||
--muted-foreground: oklch(0.3092 0.0518 219.6516);
|
||||
--accent: oklch(0.5808 0.1732 39.5003);
|
||||
--accent-foreground: oklch(1.0000 0 0);
|
||||
--destructive: oklch(0.5863 0.2064 27.1172);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.6537 0.0197 205.2618);
|
||||
--input: oklch(0.6537 0.0197 205.2618);
|
||||
--ring: oklch(0.5924 0.2025 355.8943);
|
||||
--chart-1: oklch(0.6149 0.1394 244.9273);
|
||||
--chart-2: oklch(0.6437 0.1019 187.3840);
|
||||
--chart-3: oklch(0.5924 0.2025 355.8943);
|
||||
--chart-4: oklch(0.5808 0.1732 39.5003);
|
||||
--chart-5: oklch(0.5863 0.2064 27.1172);
|
||||
--sidebar: oklch(0.9735 0.0261 90.0953);
|
||||
--sidebar-foreground: oklch(0.3092 0.0518 219.6516);
|
||||
--sidebar-primary: oklch(0.5924 0.2025 355.8943);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.6437 0.1019 187.3840);
|
||||
--sidebar-accent-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-border: oklch(0.6537 0.0197 205.2618);
|
||||
--sidebar-ring: oklch(0.5924 0.2025 355.8943);
|
||||
--font-sans: Outfit, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: Space Mono, monospace;
|
||||
--radius: 0.25rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 4px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.15;
|
||||
--shadow-color: hsl(196 83% 10%);
|
||||
--shadow-2xs: 2px 2px 4px 0px hsl(196 83% 10% / 0.07);
|
||||
--shadow-xs: 2px 2px 4px 0px hsl(196 83% 10% / 0.07);
|
||||
--shadow-sm: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 1px 2px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 1px 2px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow-md: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 2px 4px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow-lg: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 4px 6px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow-xl: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 8px 10px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow-2xl: 2px 2px 4px 0px hsl(196 83% 10% / 0.38);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2673 0.0486 219.8169);
|
||||
--foreground: oklch(0.6979 0.0159 196.7940);
|
||||
--card: oklch(0.3092 0.0518 219.6516);
|
||||
--card-foreground: oklch(0.6979 0.0159 196.7940);
|
||||
--popover: oklch(0.3092 0.0518 219.6516);
|
||||
--popover-foreground: oklch(0.6979 0.0159 196.7940);
|
||||
--primary: oklch(0.5924 0.2025 355.8943);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.6437 0.1019 187.3840);
|
||||
--secondary-foreground: oklch(1.0000 0 0);
|
||||
--muted: oklch(0.5230 0.0283 219.1365);
|
||||
--muted-foreground: oklch(0.6979 0.0159 196.7940);
|
||||
--accent: oklch(0.5808 0.1732 39.5003);
|
||||
--accent-foreground: oklch(1.0000 0 0);
|
||||
--destructive: oklch(0.5863 0.2064 27.1172);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.5230 0.0283 219.1365);
|
||||
--input: oklch(0.5230 0.0283 219.1365);
|
||||
--ring: oklch(0.5924 0.2025 355.8943);
|
||||
--chart-1: oklch(0.6149 0.1394 244.9273);
|
||||
--chart-2: oklch(0.6437 0.1019 187.3840);
|
||||
--chart-3: oklch(0.5924 0.2025 355.8943);
|
||||
--chart-4: oklch(0.5808 0.1732 39.5003);
|
||||
--chart-5: oklch(0.5863 0.2064 27.1172);
|
||||
--sidebar: oklch(0.2673 0.0486 219.8169);
|
||||
--sidebar-foreground: oklch(0.6979 0.0159 196.7940);
|
||||
--sidebar-primary: oklch(0.5924 0.2025 355.8943);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.6437 0.1019 187.3840);
|
||||
--sidebar-accent-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-border: oklch(0.5230 0.0283 219.1365);
|
||||
--sidebar-ring: oklch(0.5924 0.2025 355.8943);
|
||||
--font-sans: Outfit, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: Space Mono, monospace;
|
||||
--radius: 0.25rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 4px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.15;
|
||||
--shadow-color: hsl(196 83% 10%);
|
||||
--shadow-2xs: 2px 2px 4px 0px hsl(196 83% 10% / 0.07);
|
||||
--shadow-xs: 2px 2px 4px 0px hsl(196 83% 10% / 0.07);
|
||||
--shadow-sm: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 1px 2px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 1px 2px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow-md: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 2px 4px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow-lg: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 4px 6px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow-xl: 2px 2px 4px 0px hsl(196 83% 10% / 0.15), 2px 8px 10px -1px hsl(196 83% 10% / 0.15);
|
||||
--shadow-2xl: 2px 2px 4px 0px hsl(196 83% 10% / 0.38);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/sage.css
Normal file
160
public/themes/sage.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9761 0.0041 91.4461);
|
||||
--foreground: oklch(0.2417 0.0298 269.8827);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.2417 0.0298 269.8827);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.2417 0.0298 269.8827);
|
||||
--primary: oklch(0.6333 0.0309 154.9039);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.8596 0.0291 119.9919);
|
||||
--secondary-foreground: oklch(0.2417 0.0298 269.8827);
|
||||
--muted: oklch(0.9251 0.0071 88.6450);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.8242 0.0221 136.6092);
|
||||
--accent-foreground: oklch(0.2417 0.0298 269.8827);
|
||||
--destructive: oklch(0.5624 0.1743 26.1433);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9251 0.0071 88.6450);
|
||||
--input: oklch(1.0000 0 0);
|
||||
--ring: oklch(0.6333 0.0309 154.9039);
|
||||
--chart-1: oklch(0.6333 0.0309 154.9039);
|
||||
--chart-2: oklch(0.7209 0.0489 120.9474);
|
||||
--chart-3: oklch(0.6744 0.0427 136.0110);
|
||||
--chart-4: oklch(0.5510 0.0234 264.3637);
|
||||
--chart-5: oklch(0.9251 0.0071 88.6450);
|
||||
--sidebar: oklch(0.9845 0.0026 106.4477);
|
||||
--sidebar-foreground: oklch(0.2417 0.0298 269.8827);
|
||||
--sidebar-primary: oklch(0.6333 0.0309 154.9039);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9251 0.0071 88.6450);
|
||||
--sidebar-accent-foreground: oklch(0.2417 0.0298 269.8827);
|
||||
--sidebar-border: oklch(0.9251 0.0071 88.6450);
|
||||
--sidebar-ring: oklch(0.6333 0.0309 154.9039);
|
||||
--font-sans: Antic, ui-sans-serif, sans-serif, system-ui;
|
||||
--font-serif: Signifier, Georgia, serif;
|
||||
--font-mono: JetBrains Mono, Courier New, monospace;
|
||||
--radius: 0.35rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 2px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.04;
|
||||
--shadow-color: #1a1f2e;
|
||||
--shadow-2xs: 0px 1px 2px 0px hsl(225 27.7778% 14.1176% / 0.02);
|
||||
--shadow-xs: 0px 1px 2px 0px hsl(225 27.7778% 14.1176% / 0.02);
|
||||
--shadow-sm: 0px 1px 2px 0px hsl(225 27.7778% 14.1176% / 0.04), 0px 1px 2px -1px hsl(225 27.7778% 14.1176% / 0.04);
|
||||
--shadow: 0px 1px 2px 0px hsl(225 27.7778% 14.1176% / 0.04), 0px 1px 2px -1px hsl(225 27.7778% 14.1176% / 0.04);
|
||||
--shadow-md: 0px 1px 2px 0px hsl(225 27.7778% 14.1176% / 0.04), 0px 2px 4px -1px hsl(225 27.7778% 14.1176% / 0.04);
|
||||
--shadow-lg: 0px 1px 2px 0px hsl(225 27.7778% 14.1176% / 0.04), 0px 4px 6px -1px hsl(225 27.7778% 14.1176% / 0.04);
|
||||
--shadow-xl: 0px 1px 2px 0px hsl(225 27.7778% 14.1176% / 0.04), 0px 8px 10px -1px hsl(225 27.7778% 14.1176% / 0.04);
|
||||
--shadow-2xl: 0px 1px 2px 0px hsl(225 27.7778% 14.1176% / 0.10);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.23rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1448 0 0);
|
||||
--foreground: oklch(0.9702 0 0);
|
||||
--card: oklch(0.1822 0 0);
|
||||
--card-foreground: oklch(0.9702 0 0);
|
||||
--popover: oklch(0.1822 0 0);
|
||||
--popover-foreground: oklch(0.9702 0 0);
|
||||
--primary: oklch(0.6333 0.0309 154.9039);
|
||||
--primary-foreground: oklch(0 0 0);
|
||||
--secondary: oklch(0.2178 0 0);
|
||||
--secondary-foreground: oklch(0.9702 0 0);
|
||||
--muted: oklch(0.2178 0 0);
|
||||
--muted-foreground: oklch(0.7058 0 0);
|
||||
--accent: oklch(0.3709 0.0248 153.9823);
|
||||
--accent-foreground: oklch(0.9702 0 0);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.2850 0 0);
|
||||
--input: oklch(0.1822 0 0);
|
||||
--ring: oklch(0.6333 0.0309 154.9039);
|
||||
--chart-1: oklch(0.6333 0.0309 154.9039);
|
||||
--chart-2: oklch(0.7209 0.0489 120.9474);
|
||||
--chart-3: oklch(0.6744 0.0427 136.0110);
|
||||
--chart-4: oklch(0.5510 0.0234 264.3637);
|
||||
--chart-5: oklch(0.5096 0.0289 152.3460);
|
||||
--sidebar: oklch(0.1684 0 0);
|
||||
--sidebar-foreground: oklch(0.9702 0 0);
|
||||
--sidebar-primary: oklch(0.6333 0.0309 154.9039);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.2178 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.9702 0 0);
|
||||
--sidebar-border: oklch(0.2850 0 0);
|
||||
--sidebar-ring: oklch(0.6333 0.0309 154.9039);
|
||||
--font-sans: Antic, ui-sans-serif, sans-serif, system-ui;
|
||||
--font-serif: Signifier, Georgia, serif;
|
||||
--font-mono: JetBrains Mono, Courier New, monospace;
|
||||
--radius: 0.35rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 2px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.04;
|
||||
--shadow-color: #000000;
|
||||
--shadow-2xs: 0px 1px 2px 0px hsl(0 0% 0% / 0.02);
|
||||
--shadow-xs: 0px 1px 2px 0px hsl(0 0% 0% / 0.02);
|
||||
--shadow-sm: 0px 1px 2px 0px hsl(0 0% 0% / 0.04), 0px 1px 2px -1px hsl(0 0% 0% / 0.04);
|
||||
--shadow: 0px 1px 2px 0px hsl(0 0% 0% / 0.04), 0px 1px 2px -1px hsl(0 0% 0% / 0.04);
|
||||
--shadow-md: 0px 1px 2px 0px hsl(0 0% 0% / 0.04), 0px 2px 4px -1px hsl(0 0% 0% / 0.04);
|
||||
--shadow-lg: 0px 1px 2px 0px hsl(0 0% 0% / 0.04), 0px 4px 6px -1px hsl(0 0% 0% / 0.04);
|
||||
--shadow-xl: 0px 1px 2px 0px hsl(0 0% 0% / 0.04), 0px 8px 10px -1px hsl(0 0% 0% / 0.04);
|
||||
--shadow-2xl: 0px 1px 2px 0px hsl(0 0% 0% / 0.10);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
171
public/themes/softpop.css
Normal file
171
public/themes/softpop.css
Normal file
@ -0,0 +1,171 @@
|
||||
:root {
|
||||
--background: oklch(0.9789 0.0082 121.6272);
|
||||
--foreground: oklch(0 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0 0 0);
|
||||
--primary: oklch(0.5106 0.2301 276.9656);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.7038 0.1230 182.5025);
|
||||
--secondary-foreground: oklch(1.0000 0 0);
|
||||
--muted: oklch(0.9551 0 0);
|
||||
--muted-foreground: oklch(0.3211 0 0);
|
||||
--accent: oklch(0.7686 0.1647 70.0804);
|
||||
--accent-foreground: oklch(0 0 0);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0 0 0);
|
||||
--input: oklch(0.5555 0 0);
|
||||
--ring: oklch(0.7853 0.1041 274.7134);
|
||||
--chart-1: oklch(0.5106 0.2301 276.9656);
|
||||
--chart-2: oklch(0.7038 0.1230 182.5025);
|
||||
--chart-3: oklch(0.7686 0.1647 70.0804);
|
||||
--chart-4: oklch(0.6559 0.2118 354.3084);
|
||||
--chart-5: oklch(0.7227 0.1920 149.5793);
|
||||
--sidebar: oklch(0.9789 0.0082 121.6272);
|
||||
--sidebar-foreground: oklch(0 0 0);
|
||||
--sidebar-primary: oklch(0.5106 0.2301 276.9656);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.7686 0.1647 70.0804);
|
||||
--sidebar-accent-foreground: oklch(0 0 0);
|
||||
--sidebar-border: oklch(0 0 0);
|
||||
--sidebar-ring: oklch(0.7853 0.1041 274.7134);
|
||||
--font-sans: DM Sans, sans-serif;
|
||||
--font-serif: DM Sans, sans-serif;
|
||||
--font-mono: Space Mono, monospace;
|
||||
--radius: 1rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 0px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.05;
|
||||
--shadow-color: #1a1a1a;
|
||||
--shadow-2xs: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.03);
|
||||
--shadow-xs: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.03);
|
||||
--shadow-sm: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 1px 2px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 1px 2px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow-md: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 2px 4px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow-lg: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 4px 6px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow-xl: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 8px 10px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow-2xl: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.13);
|
||||
--tracking-normal: normal;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0 0 0);
|
||||
--foreground: oklch(1.0000 0 0);
|
||||
--card: oklch(0.2455 0.0217 257.2823);
|
||||
--card-foreground: oklch(1.0000 0 0);
|
||||
--popover: oklch(0.2455 0.0217 257.2823);
|
||||
--popover-foreground: oklch(1.0000 0 0);
|
||||
--primary: oklch(0.6801 0.1583 276.9349);
|
||||
--primary-foreground: oklch(0 0 0);
|
||||
--secondary: oklch(0.7845 0.1325 181.9120);
|
||||
--secondary-foreground: oklch(0 0 0);
|
||||
--muted: oklch(0.3211 0 0);
|
||||
--muted-foreground: oklch(0.8452 0 0);
|
||||
--accent: oklch(0.8790 0.1534 91.6054);
|
||||
--accent-foreground: oklch(0 0 0);
|
||||
--destructive: oklch(0.7106 0.1661 22.2162);
|
||||
--destructive-foreground: oklch(0 0 0);
|
||||
--border: oklch(0.4459 0 0);
|
||||
--input: oklch(1.0000 0 0);
|
||||
--ring: oklch(0.6801 0.1583 276.9349);
|
||||
--chart-1: oklch(0.6801 0.1583 276.9349);
|
||||
--chart-2: oklch(0.7845 0.1325 181.9120);
|
||||
--chart-3: oklch(0.8790 0.1534 91.6054);
|
||||
--chart-4: oklch(0.7253 0.1752 349.7607);
|
||||
--chart-5: oklch(0.8003 0.1821 151.7110);
|
||||
--sidebar: oklch(0 0 0);
|
||||
--sidebar-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-primary: oklch(0.6801 0.1583 276.9349);
|
||||
--sidebar-primary-foreground: oklch(0 0 0);
|
||||
--sidebar-accent: oklch(0.8790 0.1534 91.6054);
|
||||
--sidebar-accent-foreground: oklch(0 0 0);
|
||||
--sidebar-border: oklch(1.0000 0 0);
|
||||
--sidebar-ring: oklch(0.6801 0.1583 276.9349);
|
||||
--font-sans: DM Sans, sans-serif;
|
||||
--font-serif: DM Sans, sans-serif;
|
||||
--font-mono: Space Mono, monospace;
|
||||
--radius: 1rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 0px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.05;
|
||||
--shadow-color: #1a1a1a;
|
||||
--shadow-2xs: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.03);
|
||||
--shadow-xs: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.03);
|
||||
--shadow-sm: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 1px 2px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 1px 2px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow-md: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 2px 4px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow-lg: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 4px 6px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow-xl: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.05), 0px 8px 10px -1px hsl(0 0% 10.1961% / 0.05);
|
||||
--shadow-2xl: 0px 0px 0px 0px hsl(0 0% 10.1961% / 0.13);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
|
||||
--tracking-tighter: calc(var(--tracking-normal) - 0.05em);
|
||||
--tracking-tight: calc(var(--tracking-normal) - 0.025em);
|
||||
--tracking-normal: var(--tracking-normal);
|
||||
--tracking-wide: calc(var(--tracking-normal) + 0.025em);
|
||||
--tracking-wider: calc(var(--tracking-normal) + 0.05em);
|
||||
--tracking-widest: calc(var(--tracking-normal) + 0.1em);
|
||||
}
|
||||
|
||||
body {
|
||||
letter-spacing: var(--tracking-normal);
|
||||
}
|
||||
160
public/themes/solardusk.css
Normal file
160
public/themes/solardusk.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9885 0.0057 84.5659);
|
||||
--foreground: oklch(0.3660 0.0251 49.6085);
|
||||
--card: oklch(0.9686 0.0091 78.2818);
|
||||
--card-foreground: oklch(0.3660 0.0251 49.6085);
|
||||
--popover: oklch(0.9686 0.0091 78.2818);
|
||||
--popover-foreground: oklch(0.3660 0.0251 49.6085);
|
||||
--primary: oklch(0.5553 0.1455 48.9975);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.8276 0.0752 74.4400);
|
||||
--secondary-foreground: oklch(0.4444 0.0096 73.6390);
|
||||
--muted: oklch(0.9363 0.0218 83.2637);
|
||||
--muted-foreground: oklch(0.5534 0.0116 58.0708);
|
||||
--accent: oklch(0.9000 0.0500 74.9889);
|
||||
--accent-foreground: oklch(0.4444 0.0096 73.6390);
|
||||
--destructive: oklch(0.4437 0.1613 26.8994);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8866 0.0404 89.6994);
|
||||
--input: oklch(0.8866 0.0404 89.6994);
|
||||
--ring: oklch(0.5553 0.1455 48.9975);
|
||||
--chart-1: oklch(0.5553 0.1455 48.9975);
|
||||
--chart-2: oklch(0.5534 0.0116 58.0708);
|
||||
--chart-3: oklch(0.5538 0.1207 66.4416);
|
||||
--chart-4: oklch(0.5534 0.0116 58.0708);
|
||||
--chart-5: oklch(0.6806 0.1423 75.8340);
|
||||
--sidebar: oklch(0.9363 0.0218 83.2637);
|
||||
--sidebar-foreground: oklch(0.3660 0.0251 49.6085);
|
||||
--sidebar-primary: oklch(0.5553 0.1455 48.9975);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.5538 0.1207 66.4416);
|
||||
--sidebar-accent-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-border: oklch(0.8866 0.0404 89.6994);
|
||||
--sidebar-ring: oklch(0.5553 0.1455 48.9975);
|
||||
--font-sans: Oxanium, sans-serif;
|
||||
--font-serif: Merriweather, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.3rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.18;
|
||||
--shadow-color: hsl(28 18% 25%);
|
||||
--shadow-2xs: 0px 2px 3px 0px hsl(28 18% 25% / 0.09);
|
||||
--shadow-xs: 0px 2px 3px 0px hsl(28 18% 25% / 0.09);
|
||||
--shadow-sm: 0px 2px 3px 0px hsl(28 18% 25% / 0.18), 0px 1px 2px -1px hsl(28 18% 25% / 0.18);
|
||||
--shadow: 0px 2px 3px 0px hsl(28 18% 25% / 0.18), 0px 1px 2px -1px hsl(28 18% 25% / 0.18);
|
||||
--shadow-md: 0px 2px 3px 0px hsl(28 18% 25% / 0.18), 0px 2px 4px -1px hsl(28 18% 25% / 0.18);
|
||||
--shadow-lg: 0px 2px 3px 0px hsl(28 18% 25% / 0.18), 0px 4px 6px -1px hsl(28 18% 25% / 0.18);
|
||||
--shadow-xl: 0px 2px 3px 0px hsl(28 18% 25% / 0.18), 0px 8px 10px -1px hsl(28 18% 25% / 0.18);
|
||||
--shadow-2xl: 0px 2px 3px 0px hsl(28 18% 25% / 0.45);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.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.7049 0.1867 47.6044);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.4444 0.0096 73.6390);
|
||||
--secondary-foreground: oklch(0.9232 0.0026 48.7171);
|
||||
--muted: oklch(0.2330 0.0073 67.4563);
|
||||
--muted-foreground: oklch(0.7161 0.0091 56.2590);
|
||||
--accent: oklch(0.3598 0.0497 229.3202);
|
||||
--accent-foreground: oklch(0.9232 0.0026 48.7171);
|
||||
--destructive: oklch(0.5771 0.2152 27.3250);
|
||||
--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.7049 0.1867 47.6044);
|
||||
--chart-1: oklch(0.7049 0.1867 47.6044);
|
||||
--chart-2: oklch(0.6847 0.1479 237.3225);
|
||||
--chart-3: oklch(0.7952 0.1617 86.0468);
|
||||
--chart-4: oklch(0.7161 0.0091 56.2590);
|
||||
--chart-5: oklch(0.5534 0.0116 58.0708);
|
||||
--sidebar: oklch(0.2685 0.0063 34.2976);
|
||||
--sidebar-foreground: oklch(0.9699 0.0013 106.4238);
|
||||
--sidebar-primary: oklch(0.7049 0.1867 47.6044);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.6847 0.1479 237.3225);
|
||||
--sidebar-accent-foreground: oklch(0.2839 0.0734 254.5378);
|
||||
--sidebar-border: oklch(0.3741 0.0087 67.5582);
|
||||
--sidebar-ring: oklch(0.7049 0.1867 47.6044);
|
||||
--font-sans: Oxanium, sans-serif;
|
||||
--font-serif: Merriweather, serif;
|
||||
--font-mono: Fira Code, monospace;
|
||||
--radius: 0.3rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.18;
|
||||
--shadow-color: hsl(0 0% 5%);
|
||||
--shadow-2xs: 0px 2px 3px 0px hsl(0 0% 5% / 0.09);
|
||||
--shadow-xs: 0px 2px 3px 0px hsl(0 0% 5% / 0.09);
|
||||
--shadow-sm: 0px 2px 3px 0px hsl(0 0% 5% / 0.18), 0px 1px 2px -1px hsl(0 0% 5% / 0.18);
|
||||
--shadow: 0px 2px 3px 0px hsl(0 0% 5% / 0.18), 0px 1px 2px -1px hsl(0 0% 5% / 0.18);
|
||||
--shadow-md: 0px 2px 3px 0px hsl(0 0% 5% / 0.18), 0px 2px 4px -1px hsl(0 0% 5% / 0.18);
|
||||
--shadow-lg: 0px 2px 3px 0px hsl(0 0% 5% / 0.18), 0px 4px 6px -1px hsl(0 0% 5% / 0.18);
|
||||
--shadow-xl: 0px 2px 3px 0px hsl(0 0% 5% / 0.18), 0px 8px 10px -1px hsl(0 0% 5% / 0.18);
|
||||
--shadow-2xl: 0px 2px 3px 0px hsl(0 0% 5% / 0.45);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/starry.css
Normal file
160
public/themes/starry.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9755 0.0045 258.3245);
|
||||
--foreground: oklch(0.2558 0.0433 268.0662);
|
||||
--card: oklch(0.9341 0.0132 251.5628);
|
||||
--card-foreground: oklch(0.2558 0.0433 268.0662);
|
||||
--popover: oklch(0.9856 0.0278 98.0540);
|
||||
--popover-foreground: oklch(0.2558 0.0433 268.0662);
|
||||
--primary: oklch(0.4815 0.1178 263.3758);
|
||||
--primary-foreground: oklch(0.9856 0.0278 98.0540);
|
||||
--secondary: oklch(0.8567 0.1164 81.0092);
|
||||
--secondary-foreground: oklch(0.2558 0.0433 268.0662);
|
||||
--muted: oklch(0.9202 0.0080 106.5563);
|
||||
--muted-foreground: oklch(0.4815 0.1178 263.3758);
|
||||
--accent: oklch(0.6896 0.0714 234.0387);
|
||||
--accent-foreground: oklch(0.9856 0.0278 98.0540);
|
||||
--destructive: oklch(0.2611 0.0376 322.5267);
|
||||
--destructive-foreground: oklch(0.9856 0.0278 98.0540);
|
||||
--border: oklch(0.7791 0.0156 251.1926);
|
||||
--input: oklch(0.6896 0.0714 234.0387);
|
||||
--ring: oklch(0.8567 0.1164 81.0092);
|
||||
--chart-1: oklch(0.4815 0.1178 263.3758);
|
||||
--chart-2: oklch(0.8567 0.1164 81.0092);
|
||||
--chart-3: oklch(0.6896 0.0714 234.0387);
|
||||
--chart-4: oklch(0.7791 0.0156 251.1926);
|
||||
--chart-5: oklch(0.2611 0.0376 322.5267);
|
||||
--sidebar: oklch(0.9341 0.0132 251.5628);
|
||||
--sidebar-foreground: oklch(0.2558 0.0433 268.0662);
|
||||
--sidebar-primary: oklch(0.4815 0.1178 263.3758);
|
||||
--sidebar-primary-foreground: oklch(0.9856 0.0278 98.0540);
|
||||
--sidebar-accent: oklch(0.8567 0.1164 81.0092);
|
||||
--sidebar-accent-foreground: oklch(0.2558 0.0433 268.0662);
|
||||
--sidebar-border: oklch(0.7791 0.0156 251.1926);
|
||||
--sidebar-ring: oklch(0.8567 0.1164 81.0092);
|
||||
--font-sans: Libre Baskerville, serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2204 0.0198 275.8439);
|
||||
--foreground: oklch(0.9366 0.0129 266.6974);
|
||||
--card: oklch(0.2703 0.0407 281.3036);
|
||||
--card-foreground: oklch(0.9366 0.0129 266.6974);
|
||||
--popover: oklch(0.2703 0.0407 281.3036);
|
||||
--popover-foreground: oklch(0.9097 0.1440 95.1120);
|
||||
--primary: oklch(0.4815 0.1178 263.3758);
|
||||
--primary-foreground: oklch(0.9097 0.1440 95.1120);
|
||||
--secondary: oklch(0.9097 0.1440 95.1120);
|
||||
--secondary-foreground: oklch(0.2703 0.0407 281.3036);
|
||||
--muted: oklch(0.2424 0.0324 281.0890);
|
||||
--muted-foreground: oklch(0.6243 0.0412 262.0375);
|
||||
--accent: oklch(0.8469 0.0524 264.7751);
|
||||
--accent-foreground: oklch(0.2204 0.0198 275.8439);
|
||||
--destructive: oklch(0.5280 0.1200 357.1130);
|
||||
--destructive-foreground: oklch(0.9097 0.1440 95.1120);
|
||||
--border: oklch(0.3072 0.0287 281.7681);
|
||||
--input: oklch(0.4815 0.1178 263.3758);
|
||||
--ring: oklch(0.9097 0.1440 95.1120);
|
||||
--chart-1: oklch(0.4815 0.1178 263.3758);
|
||||
--chart-2: oklch(0.9097 0.1440 95.1120);
|
||||
--chart-3: oklch(0.6896 0.0714 234.0387);
|
||||
--chart-4: oklch(0.6243 0.0412 262.0375);
|
||||
--chart-5: oklch(0.5280 0.1200 357.1130);
|
||||
--sidebar: oklch(0.2703 0.0407 281.3036);
|
||||
--sidebar-foreground: oklch(0.9366 0.0129 266.6974);
|
||||
--sidebar-primary: oklch(0.4815 0.1178 263.3758);
|
||||
--sidebar-primary-foreground: oklch(0.9097 0.1440 95.1120);
|
||||
--sidebar-accent: oklch(0.9097 0.1440 95.1120);
|
||||
--sidebar-accent-foreground: oklch(0.2703 0.0407 281.3036);
|
||||
--sidebar-border: oklch(0.3072 0.0287 281.7681);
|
||||
--sidebar-ring: oklch(0.9097 0.1440 95.1120);
|
||||
--font-sans: Libre Baskerville, serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/sunset.css
Normal file
160
public/themes/sunset.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--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);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Merriweather, serif;
|
||||
--font-mono: Ubuntu Mono, monospace;
|
||||
--radius: 0.625rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 6px;
|
||||
--shadow-blur: 12px;
|
||||
--shadow-spread: -3px;
|
||||
--shadow-opacity: 0.09;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 6px 12px -3px hsl(0 0% 0% / 0.04);
|
||||
--shadow-xs: 0px 6px 12px -3px hsl(0 0% 0% / 0.04);
|
||||
--shadow-sm: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 1px 2px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 1px 2px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-md: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 2px 4px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-lg: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 4px 6px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-xl: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 8px 10px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-2xl: 0px 6px 12px -3px hsl(0 0% 0% / 0.22);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.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);
|
||||
--font-sans: Montserrat, sans-serif;
|
||||
--font-serif: Merriweather, serif;
|
||||
--font-mono: Ubuntu Mono, monospace;
|
||||
--radius: 0.625rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 6px;
|
||||
--shadow-blur: 12px;
|
||||
--shadow-spread: -3px;
|
||||
--shadow-opacity: 0.09;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 6px 12px -3px hsl(0 0% 0% / 0.04);
|
||||
--shadow-xs: 0px 6px 12px -3px hsl(0 0% 0% / 0.04);
|
||||
--shadow-sm: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 1px 2px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 1px 2px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-md: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 2px 4px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-lg: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 4px 6px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-xl: 0px 6px 12px -3px hsl(0 0% 0% / 0.09), 0px 8px 10px -4px hsl(0 0% 0% / 0.09);
|
||||
--shadow-2xl: 0px 6px 12px -3px hsl(0 0% 0% / 0.22);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
171
public/themes/supabase.css
Normal file
171
public/themes/supabase.css
Normal file
@ -0,0 +1,171 @@
|
||||
:root {
|
||||
--background: oklch(0.9911 0 0);
|
||||
--foreground: oklch(0.2046 0 0);
|
||||
--card: oklch(0.9911 0 0);
|
||||
--card-foreground: oklch(0.2046 0 0);
|
||||
--popover: oklch(0.9911 0 0);
|
||||
--popover-foreground: oklch(0.4386 0 0);
|
||||
--primary: oklch(0.8348 0.1302 160.9080);
|
||||
--primary-foreground: oklch(0.2626 0.0147 166.4589);
|
||||
--secondary: oklch(0.9940 0 0);
|
||||
--secondary-foreground: oklch(0.2046 0 0);
|
||||
--muted: oklch(0.9461 0 0);
|
||||
--muted-foreground: oklch(0.2435 0 0);
|
||||
--accent: oklch(0.9461 0 0);
|
||||
--accent-foreground: oklch(0.2435 0 0);
|
||||
--destructive: oklch(0.5523 0.1927 32.7272);
|
||||
--destructive-foreground: oklch(0.9934 0.0032 17.2118);
|
||||
--border: oklch(0.9037 0 0);
|
||||
--input: oklch(0.9731 0 0);
|
||||
--ring: oklch(0.8348 0.1302 160.9080);
|
||||
--chart-1: oklch(0.8348 0.1302 160.9080);
|
||||
--chart-2: oklch(0.6231 0.1880 259.8145);
|
||||
--chart-3: oklch(0.6056 0.2189 292.7172);
|
||||
--chart-4: oklch(0.7686 0.1647 70.0804);
|
||||
--chart-5: oklch(0.6959 0.1491 162.4796);
|
||||
--sidebar: oklch(0.9911 0 0);
|
||||
--sidebar-foreground: oklch(0.5452 0 0);
|
||||
--sidebar-primary: oklch(0.8348 0.1302 160.9080);
|
||||
--sidebar-primary-foreground: oklch(0.2626 0.0147 166.4589);
|
||||
--sidebar-accent: oklch(0.9461 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.2435 0 0);
|
||||
--sidebar-border: oklch(0.9037 0 0);
|
||||
--sidebar-ring: oklch(0.8348 0.1302 160.9080);
|
||||
--font-sans: Outfit, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.17;
|
||||
--shadow-color: #000000;
|
||||
--shadow-2xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.09);
|
||||
--shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.09);
|
||||
--shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 1px 2px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 1px 2px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow-md: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 2px 4px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow-lg: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 4px 6px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow-xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 8px 10px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow-2xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.43);
|
||||
--tracking-normal: 0.025em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.1822 0 0);
|
||||
--foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--card: oklch(0.2046 0 0);
|
||||
--card-foreground: oklch(0.9288 0.0126 255.5078);
|
||||
--popover: oklch(0.2603 0 0);
|
||||
--popover-foreground: oklch(0.7348 0 0);
|
||||
--primary: oklch(0.4365 0.1044 156.7556);
|
||||
--primary-foreground: oklch(0.9213 0.0135 167.1556);
|
||||
--secondary: oklch(0.2603 0 0);
|
||||
--secondary-foreground: oklch(0.9851 0 0);
|
||||
--muted: oklch(0.2393 0 0);
|
||||
--muted-foreground: oklch(0.7122 0 0);
|
||||
--accent: oklch(0.3132 0 0);
|
||||
--accent-foreground: oklch(0.9851 0 0);
|
||||
--destructive: oklch(0.3123 0.0852 29.7877);
|
||||
--destructive-foreground: oklch(0.9368 0.0045 34.3092);
|
||||
--border: oklch(0.2809 0 0);
|
||||
--input: oklch(0.2603 0 0);
|
||||
--ring: oklch(0.8003 0.1821 151.7110);
|
||||
--chart-1: oklch(0.8003 0.1821 151.7110);
|
||||
--chart-2: oklch(0.7137 0.1434 254.6240);
|
||||
--chart-3: oklch(0.7090 0.1592 293.5412);
|
||||
--chart-4: oklch(0.8369 0.1644 84.4286);
|
||||
--chart-5: oklch(0.7845 0.1325 181.9120);
|
||||
--sidebar: oklch(0.1822 0 0);
|
||||
--sidebar-foreground: oklch(0.6301 0 0);
|
||||
--sidebar-primary: oklch(0.4365 0.1044 156.7556);
|
||||
--sidebar-primary-foreground: oklch(0.9213 0.0135 167.1556);
|
||||
--sidebar-accent: oklch(0.3132 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.9851 0 0);
|
||||
--sidebar-border: oklch(0.2809 0 0);
|
||||
--sidebar-ring: oklch(0.8003 0.1821 151.7110);
|
||||
--font-sans: Outfit, sans-serif;
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.17;
|
||||
--shadow-color: #000000;
|
||||
--shadow-2xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.09);
|
||||
--shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.09);
|
||||
--shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 1px 2px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 1px 2px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow-md: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 2px 4px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow-lg: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 4px 6px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow-xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.17), 0px 8px 10px -1px hsl(0 0% 0% / 0.17);
|
||||
--shadow-2xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.43);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
|
||||
--tracking-tighter: calc(var(--tracking-normal) - 0.05em);
|
||||
--tracking-tight: calc(var(--tracking-normal) - 0.025em);
|
||||
--tracking-normal: var(--tracking-normal);
|
||||
--tracking-wide: calc(var(--tracking-normal) + 0.025em);
|
||||
--tracking-wider: calc(var(--tracking-normal) + 0.05em);
|
||||
--tracking-widest: calc(var(--tracking-normal) + 0.1em);
|
||||
}
|
||||
|
||||
body {
|
||||
letter-spacing: var(--tracking-normal);
|
||||
}
|
||||
160
public/themes/t3chat.css
Normal file
160
public/themes/t3chat.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9754 0.0084 325.6414);
|
||||
--foreground: oklch(0.3257 0.1161 325.0372);
|
||||
--card: oklch(0.9754 0.0084 325.6414);
|
||||
--card-foreground: oklch(0.3257 0.1161 325.0372);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3257 0.1161 325.0372);
|
||||
--primary: oklch(0.5316 0.1409 355.1999);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.8696 0.0675 334.8991);
|
||||
--secondary-foreground: oklch(0.4448 0.1341 324.7991);
|
||||
--muted: oklch(0.9395 0.0260 331.5454);
|
||||
--muted-foreground: oklch(0.4924 0.1244 324.4523);
|
||||
--accent: oklch(0.8696 0.0675 334.8991);
|
||||
--accent-foreground: oklch(0.4448 0.1341 324.7991);
|
||||
--destructive: oklch(0.5248 0.1368 20.8317);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8568 0.0829 328.9110);
|
||||
--input: oklch(0.8517 0.0558 336.6002);
|
||||
--ring: oklch(0.5916 0.2180 0.5844);
|
||||
--chart-1: oklch(0.6038 0.2363 344.4657);
|
||||
--chart-2: oklch(0.4445 0.2251 300.6246);
|
||||
--chart-3: oklch(0.3790 0.0438 226.1538);
|
||||
--chart-4: oklch(0.8330 0.1185 88.3461);
|
||||
--chart-5: oklch(0.7843 0.1256 58.9964);
|
||||
--sidebar: oklch(0.9360 0.0288 320.5788);
|
||||
--sidebar-foreground: oklch(0.4948 0.1909 354.5435);
|
||||
--sidebar-primary: oklch(0.3963 0.0251 285.1962);
|
||||
--sidebar-primary-foreground: oklch(0.9668 0.0124 337.5228);
|
||||
--sidebar-accent: oklch(0.9789 0.0013 106.4235);
|
||||
--sidebar-accent-foreground: oklch(0.3963 0.0251 285.1962);
|
||||
--sidebar-border: oklch(0.9383 0.0026 48.7178);
|
||||
--sidebar-ring: oklch(0.5916 0.2180 0.5844);
|
||||
--font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2409 0.0201 307.5346);
|
||||
--foreground: oklch(0.8398 0.0387 309.5391);
|
||||
--card: oklch(0.2803 0.0232 307.5413);
|
||||
--card-foreground: oklch(0.8456 0.0302 341.4597);
|
||||
--popover: oklch(0.1548 0.0132 338.9015);
|
||||
--popover-foreground: oklch(0.9647 0.0091 341.8035);
|
||||
--primary: oklch(0.4607 0.1853 4.0994);
|
||||
--primary-foreground: oklch(0.8560 0.0618 346.3684);
|
||||
--secondary: oklch(0.3137 0.0306 310.0610);
|
||||
--secondary-foreground: oklch(0.8483 0.0382 307.9613);
|
||||
--muted: oklch(0.2634 0.0219 309.4748);
|
||||
--muted-foreground: oklch(0.7940 0.0372 307.1032);
|
||||
--accent: oklch(0.3649 0.0508 308.4911);
|
||||
--accent-foreground: oklch(0.9647 0.0091 341.8035);
|
||||
--destructive: oklch(0.2258 0.0524 12.6119);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3286 0.0154 343.4461);
|
||||
--input: oklch(0.3387 0.0195 332.8347);
|
||||
--ring: oklch(0.5916 0.2180 0.5844);
|
||||
--chart-1: oklch(0.5316 0.1409 355.1999);
|
||||
--chart-2: oklch(0.5633 0.1912 306.8561);
|
||||
--chart-3: oklch(0.7227 0.1502 60.5799);
|
||||
--chart-4: oklch(0.6193 0.2029 312.7422);
|
||||
--chart-5: oklch(0.6118 0.2093 6.1387);
|
||||
--sidebar: oklch(0.1893 0.0163 331.0475);
|
||||
--sidebar-foreground: oklch(0.8607 0.0293 343.6612);
|
||||
--sidebar-primary: oklch(0.4882 0.2172 264.3763);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.2337 0.0261 338.1961);
|
||||
--sidebar-accent-foreground: oklch(0.9674 0.0013 286.3752);
|
||||
--sidebar-border: oklch(0 0 0);
|
||||
--sidebar-ring: oklch(0.5916 0.2180 0.5844);
|
||||
--font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: oklch(0 0 0);
|
||||
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/tangerine.css
Normal file
160
public/themes/tangerine.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9383 0.0042 236.4993);
|
||||
--foreground: oklch(0.3211 0 0);
|
||||
--card: oklch(1.0000 0 0);
|
||||
--card-foreground: oklch(0.3211 0 0);
|
||||
--popover: oklch(1.0000 0 0);
|
||||
--popover-foreground: oklch(0.3211 0 0);
|
||||
--primary: oklch(0.6397 0.1720 36.4421);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9670 0.0029 264.5419);
|
||||
--secondary-foreground: oklch(0.4461 0.0263 256.8018);
|
||||
--muted: oklch(0.9846 0.0017 247.8389);
|
||||
--muted-foreground: oklch(0.5510 0.0234 264.3637);
|
||||
--accent: oklch(0.9119 0.0222 243.8174);
|
||||
--accent-foreground: oklch(0.3791 0.1378 265.5222);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9022 0.0052 247.8822);
|
||||
--input: oklch(0.9700 0.0029 264.5420);
|
||||
--ring: oklch(0.6397 0.1720 36.4421);
|
||||
--chart-1: oklch(0.7156 0.0605 248.6845);
|
||||
--chart-2: oklch(0.7875 0.0917 35.9616);
|
||||
--chart-3: oklch(0.5778 0.0759 254.1573);
|
||||
--chart-4: oklch(0.5016 0.0849 259.4902);
|
||||
--chart-5: oklch(0.4241 0.0952 264.0306);
|
||||
--sidebar: oklch(0.9030 0.0046 258.3257);
|
||||
--sidebar-foreground: oklch(0.3211 0 0);
|
||||
--sidebar-primary: oklch(0.6397 0.1720 36.4421);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9119 0.0222 243.8174);
|
||||
--sidebar-accent-foreground: oklch(0.3791 0.1378 265.5222);
|
||||
--sidebar-border: oklch(0.9276 0.0058 264.5313);
|
||||
--sidebar-ring: oklch(0.6397 0.1720 36.4421);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.75rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2598 0.0306 262.6666);
|
||||
--foreground: oklch(0.9219 0 0);
|
||||
--card: oklch(0.3106 0.0301 268.6365);
|
||||
--card-foreground: oklch(0.9219 0 0);
|
||||
--popover: oklch(0.2900 0.0249 268.3986);
|
||||
--popover-foreground: oklch(0.9219 0 0);
|
||||
--primary: oklch(0.6397 0.1720 36.4421);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.3095 0.0266 266.7132);
|
||||
--secondary-foreground: oklch(0.9219 0 0);
|
||||
--muted: oklch(0.3095 0.0266 266.7132);
|
||||
--muted-foreground: oklch(0.7155 0 0);
|
||||
--accent: oklch(0.3380 0.0589 267.5867);
|
||||
--accent-foreground: oklch(0.8823 0.0571 254.1284);
|
||||
--destructive: oklch(0.6368 0.2078 25.3313);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3843 0.0301 269.7337);
|
||||
--input: oklch(0.3843 0.0301 269.7337);
|
||||
--ring: oklch(0.6397 0.1720 36.4421);
|
||||
--chart-1: oklch(0.7156 0.0605 248.6845);
|
||||
--chart-2: oklch(0.7693 0.0876 34.1875);
|
||||
--chart-3: oklch(0.5778 0.0759 254.1573);
|
||||
--chart-4: oklch(0.5016 0.0849 259.4902);
|
||||
--chart-5: oklch(0.4241 0.0952 264.0306);
|
||||
--sidebar: oklch(0.3100 0.0283 267.7408);
|
||||
--sidebar-foreground: oklch(0.9219 0 0);
|
||||
--sidebar-primary: oklch(0.6397 0.1720 36.4421);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.3380 0.0589 267.5867);
|
||||
--sidebar-accent-foreground: oklch(0.8823 0.0571 254.1284);
|
||||
--sidebar-border: oklch(0.3843 0.0301 269.7337);
|
||||
--sidebar-ring: oklch(0.6397 0.1720 36.4421);
|
||||
--font-sans: Inter, sans-serif;
|
||||
--font-serif: Source Serif 4, serif;
|
||||
--font-mono: JetBrains Mono, monospace;
|
||||
--radius: 0.75rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.1;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
|
||||
--shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 1px 2px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-md: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 2px 4px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-lg: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 4px 6px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.10), 0px 8px 10px -1px hsl(0 0% 0% / 0.10);
|
||||
--shadow-2xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.25);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/twitter.css
Normal file
160
public/themes/twitter.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--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);
|
||||
--font-sans: Open Sans, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Menlo, monospace;
|
||||
--radius: 1.3rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0;
|
||||
--shadow-color: rgba(29,161,242,0.15);
|
||||
--shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||
--shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||
--shadow-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);
|
||||
--shadow: 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);
|
||||
--shadow-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);
|
||||
--shadow-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);
|
||||
--shadow-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);
|
||||
--shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.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);
|
||||
--font-sans: Open Sans, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Menlo, monospace;
|
||||
--radius: 1.3rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 0px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0;
|
||||
--shadow-color: rgba(29,161,242,0.25);
|
||||
--shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||
--shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||
--shadow-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);
|
||||
--shadow: 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);
|
||||
--shadow-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);
|
||||
--shadow-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);
|
||||
--shadow-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);
|
||||
--shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/vercel.css
Normal file
160
public/themes/vercel.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--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);
|
||||
--font-sans: Geist, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Geist Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 2px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.18;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 1px 2px 0px hsl(0 0% 0% / 0.09);
|
||||
--shadow-xs: 0px 1px 2px 0px hsl(0 0% 0% / 0.09);
|
||||
--shadow-sm: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 1px 2px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 1px 2px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow-md: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 2px 4px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow-lg: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 4px 6px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow-xl: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 8px 10px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow-2xl: 0px 1px 2px 0px hsl(0 0% 0% / 0.45);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.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);
|
||||
--font-sans: Geist, sans-serif;
|
||||
--font-serif: Georgia, serif;
|
||||
--font-mono: Geist Mono, monospace;
|
||||
--radius: 0.5rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 2px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.18;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 1px 2px 0px hsl(0 0% 0% / 0.09);
|
||||
--shadow-xs: 0px 1px 2px 0px hsl(0 0% 0% / 0.09);
|
||||
--shadow-sm: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 1px 2px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 1px 2px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow-md: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 2px 4px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow-lg: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 4px 6px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow-xl: 0px 1px 2px 0px hsl(0 0% 0% / 0.18), 0px 8px 10px -1px hsl(0 0% 0% / 0.18);
|
||||
--shadow-2xl: 0px 1px 2px 0px hsl(0 0% 0% / 0.45);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
160
public/themes/vintage.css
Normal file
160
public/themes/vintage.css
Normal file
@ -0,0 +1,160 @@
|
||||
:root {
|
||||
--background: oklch(0.9582 0.0152 90.2357);
|
||||
--foreground: oklch(0.3760 0.0225 64.3434);
|
||||
--card: oklch(0.9914 0.0098 87.4695);
|
||||
--card-foreground: oklch(0.3760 0.0225 64.3434);
|
||||
--popover: oklch(0.9914 0.0098 87.4695);
|
||||
--popover-foreground: oklch(0.3760 0.0225 64.3434);
|
||||
--primary: oklch(0.6180 0.0778 65.5444);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.8846 0.0302 85.5655);
|
||||
--secondary-foreground: oklch(0.4313 0.0300 64.9288);
|
||||
--muted: oklch(0.9239 0.0190 83.0636);
|
||||
--muted-foreground: oklch(0.5391 0.0387 71.1655);
|
||||
--accent: oklch(0.8348 0.0426 88.8064);
|
||||
--accent-foreground: oklch(0.3760 0.0225 64.3434);
|
||||
--destructive: oklch(0.5471 0.1438 32.9149);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.8606 0.0321 84.5881);
|
||||
--input: oklch(0.8606 0.0321 84.5881);
|
||||
--ring: oklch(0.6180 0.0778 65.5444);
|
||||
--chart-1: oklch(0.6180 0.0778 65.5444);
|
||||
--chart-2: oklch(0.5604 0.0624 68.5805);
|
||||
--chart-3: oklch(0.4851 0.0570 72.6827);
|
||||
--chart-4: oklch(0.6777 0.0624 64.7755);
|
||||
--chart-5: oklch(0.7264 0.0581 66.6967);
|
||||
--sidebar: oklch(0.9239 0.0190 83.0636);
|
||||
--sidebar-foreground: oklch(0.3760 0.0225 64.3434);
|
||||
--sidebar-primary: oklch(0.6180 0.0778 65.5444);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.8348 0.0426 88.8064);
|
||||
--sidebar-accent-foreground: oklch(0.3760 0.0225 64.3434);
|
||||
--sidebar-border: oklch(0.8606 0.0321 84.5881);
|
||||
--sidebar-ring: oklch(0.6180 0.0778 65.5444);
|
||||
--font-sans: Libre Baskerville, serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 0.25rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 3px;
|
||||
--shadow-blur: 5px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(28 13% 20%);
|
||||
--shadow-2xs: 2px 3px 5px 0px hsl(28 13% 20% / 0.06);
|
||||
--shadow-xs: 2px 3px 5px 0px hsl(28 13% 20% / 0.06);
|
||||
--shadow-sm: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 1px 2px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 1px 2px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow-md: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 2px 4px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow-lg: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 4px 6px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow-xl: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 8px 10px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow-2xl: 2px 3px 5px 0px hsl(28 13% 20% / 0.30);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2747 0.0139 57.6523);
|
||||
--foreground: oklch(0.9239 0.0190 83.0636);
|
||||
--card: oklch(0.3237 0.0155 59.0603);
|
||||
--card-foreground: oklch(0.9239 0.0190 83.0636);
|
||||
--popover: oklch(0.3237 0.0155 59.0603);
|
||||
--popover-foreground: oklch(0.9239 0.0190 83.0636);
|
||||
--primary: oklch(0.7264 0.0581 66.6967);
|
||||
--primary-foreground: oklch(0.2747 0.0139 57.6523);
|
||||
--secondary: oklch(0.3795 0.0181 57.1280);
|
||||
--secondary-foreground: oklch(0.9239 0.0190 83.0636);
|
||||
--muted: oklch(0.2939 0.0125 62.1298);
|
||||
--muted-foreground: oklch(0.7982 0.0243 82.1078);
|
||||
--accent: oklch(0.4186 0.0281 56.3404);
|
||||
--accent-foreground: oklch(0.9239 0.0190 83.0636);
|
||||
--destructive: oklch(0.5471 0.1438 32.9149);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3795 0.0181 57.1280);
|
||||
--input: oklch(0.3795 0.0181 57.1280);
|
||||
--ring: oklch(0.7264 0.0581 66.6967);
|
||||
--chart-1: oklch(0.7264 0.0581 66.6967);
|
||||
--chart-2: oklch(0.6777 0.0624 64.7755);
|
||||
--chart-3: oklch(0.6180 0.0778 65.5444);
|
||||
--chart-4: oklch(0.5604 0.0624 68.5805);
|
||||
--chart-5: oklch(0.4851 0.0570 72.6827);
|
||||
--sidebar: oklch(0.2747 0.0139 57.6523);
|
||||
--sidebar-foreground: oklch(0.9239 0.0190 83.0636);
|
||||
--sidebar-primary: oklch(0.7264 0.0581 66.6967);
|
||||
--sidebar-primary-foreground: oklch(0.2747 0.0139 57.6523);
|
||||
--sidebar-accent: oklch(0.4186 0.0281 56.3404);
|
||||
--sidebar-accent-foreground: oklch(0.9239 0.0190 83.0636);
|
||||
--sidebar-border: oklch(0.3795 0.0181 57.1280);
|
||||
--sidebar-ring: oklch(0.7264 0.0581 66.6967);
|
||||
--font-sans: Libre Baskerville, serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 0.25rem;
|
||||
--shadow-x: 2px;
|
||||
--shadow-y: 3px;
|
||||
--shadow-blur: 5px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(28 13% 20%);
|
||||
--shadow-2xs: 2px 3px 5px 0px hsl(28 13% 20% / 0.06);
|
||||
--shadow-xs: 2px 3px 5px 0px hsl(28 13% 20% / 0.06);
|
||||
--shadow-sm: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 1px 2px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 1px 2px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow-md: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 2px 4px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow-lg: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 4px 6px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow-xl: 2px 3px 5px 0px hsl(28 13% 20% / 0.12), 2px 8px 10px -1px hsl(28 13% 20% / 0.12);
|
||||
--shadow-2xl: 2px 3px 5px 0px hsl(28 13% 20% / 0.30);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
}
|
||||
171
public/themes/violet.css
Normal file
171
public/themes/violet.css
Normal file
@ -0,0 +1,171 @@
|
||||
:root {
|
||||
--background: oklch(0.9940 0 0);
|
||||
--foreground: oklch(0 0 0);
|
||||
--card: oklch(0.9940 0 0);
|
||||
--card-foreground: oklch(0 0 0);
|
||||
--popover: oklch(0.9911 0 0);
|
||||
--popover-foreground: oklch(0 0 0);
|
||||
--primary: oklch(0.5393 0.2713 286.7462);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.9540 0.0063 255.4755);
|
||||
--secondary-foreground: oklch(0.1344 0 0);
|
||||
--muted: oklch(0.9702 0 0);
|
||||
--muted-foreground: oklch(0.4386 0 0);
|
||||
--accent: oklch(0.9393 0.0288 266.3680);
|
||||
--accent-foreground: oklch(0.5445 0.1903 259.4848);
|
||||
--destructive: oklch(0.6290 0.1902 23.0704);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.9300 0.0094 286.2156);
|
||||
--input: oklch(0.9401 0 0);
|
||||
--ring: oklch(0 0 0);
|
||||
--chart-1: oklch(0.7459 0.1483 156.4499);
|
||||
--chart-2: oklch(0.5393 0.2713 286.7462);
|
||||
--chart-3: oklch(0.7336 0.1758 50.5517);
|
||||
--chart-4: oklch(0.5828 0.1809 259.7276);
|
||||
--chart-5: oklch(0.5590 0 0);
|
||||
--sidebar: oklch(0.9777 0.0051 247.8763);
|
||||
--sidebar-foreground: oklch(0 0 0);
|
||||
--sidebar-primary: oklch(0 0 0);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.9401 0 0);
|
||||
--sidebar-accent-foreground: oklch(0 0 0);
|
||||
--sidebar-border: oklch(0.9401 0 0);
|
||||
--sidebar-ring: oklch(0 0 0);
|
||||
--font-sans: Plus Jakarta Sans, sans-serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 1.4rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.16;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 2px 3px 0px hsl(0 0% 0% / 0.08);
|
||||
--shadow-xs: 0px 2px 3px 0px hsl(0 0% 0% / 0.08);
|
||||
--shadow-sm: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 1px 2px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 1px 2px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow-md: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 2px 4px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow-lg: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 4px 6px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow-xl: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 8px 10px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow-2xl: 0px 2px 3px 0px hsl(0 0% 0% / 0.40);
|
||||
--tracking-normal: -0.025em;
|
||||
--spacing: 0.27rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.2223 0.0060 271.1393);
|
||||
--foreground: oklch(0.9551 0 0);
|
||||
--card: oklch(0.2568 0.0076 274.6528);
|
||||
--card-foreground: oklch(0.9551 0 0);
|
||||
--popover: oklch(0.2568 0.0076 274.6528);
|
||||
--popover-foreground: oklch(0.9551 0 0);
|
||||
--primary: oklch(0.6132 0.2294 291.7437);
|
||||
--primary-foreground: oklch(1.0000 0 0);
|
||||
--secondary: oklch(0.2940 0.0130 272.9312);
|
||||
--secondary-foreground: oklch(0.9551 0 0);
|
||||
--muted: oklch(0.2940 0.0130 272.9312);
|
||||
--muted-foreground: oklch(0.7058 0 0);
|
||||
--accent: oklch(0.2795 0.0368 260.0310);
|
||||
--accent-foreground: oklch(0.7857 0.1153 246.6596);
|
||||
--destructive: oklch(0.7106 0.1661 22.2162);
|
||||
--destructive-foreground: oklch(1.0000 0 0);
|
||||
--border: oklch(0.3289 0.0092 268.3843);
|
||||
--input: oklch(0.3289 0.0092 268.3843);
|
||||
--ring: oklch(0.6132 0.2294 291.7437);
|
||||
--chart-1: oklch(0.8003 0.1821 151.7110);
|
||||
--chart-2: oklch(0.6132 0.2294 291.7437);
|
||||
--chart-3: oklch(0.8077 0.1035 19.5706);
|
||||
--chart-4: oklch(0.6691 0.1569 260.1063);
|
||||
--chart-5: oklch(0.7058 0 0);
|
||||
--sidebar: oklch(0.2011 0.0039 286.0396);
|
||||
--sidebar-foreground: oklch(0.9551 0 0);
|
||||
--sidebar-primary: oklch(0.6132 0.2294 291.7437);
|
||||
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||
--sidebar-accent: oklch(0.2940 0.0130 272.9312);
|
||||
--sidebar-accent-foreground: oklch(0.6132 0.2294 291.7437);
|
||||
--sidebar-border: oklch(0.3289 0.0092 268.3843);
|
||||
--sidebar-ring: oklch(0.6132 0.2294 291.7437);
|
||||
--font-sans: Plus Jakarta Sans, sans-serif;
|
||||
--font-serif: Lora, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 1.4rem;
|
||||
--shadow-x: 0px;
|
||||
--shadow-y: 2px;
|
||||
--shadow-blur: 3px;
|
||||
--shadow-spread: 0px;
|
||||
--shadow-opacity: 0.16;
|
||||
--shadow-color: hsl(0 0% 0%);
|
||||
--shadow-2xs: 0px 2px 3px 0px hsl(0 0% 0% / 0.08);
|
||||
--shadow-xs: 0px 2px 3px 0px hsl(0 0% 0% / 0.08);
|
||||
--shadow-sm: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 1px 2px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 1px 2px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow-md: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 2px 4px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow-lg: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 4px 6px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow-xl: 0px 2px 3px 0px hsl(0 0% 0% / 0.16), 0px 8px 10px -1px hsl(0 0% 0% / 0.16);
|
||||
--shadow-2xl: 0px 2px 3px 0px hsl(0 0% 0% / 0.40);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--font-sans: var(--font-sans);
|
||||
--font-mono: var(--font-mono);
|
||||
--font-serif: var(--font-serif);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
|
||||
--shadow-2xs: var(--shadow-2xs);
|
||||
--shadow-xs: var(--shadow-xs);
|
||||
--shadow-sm: var(--shadow-sm);
|
||||
--shadow: var(--shadow);
|
||||
--shadow-md: var(--shadow-md);
|
||||
--shadow-lg: var(--shadow-lg);
|
||||
--shadow-xl: var(--shadow-xl);
|
||||
--shadow-2xl: var(--shadow-2xl);
|
||||
|
||||
--tracking-tighter: calc(var(--tracking-normal) - 0.05em);
|
||||
--tracking-tight: calc(var(--tracking-normal) - 0.025em);
|
||||
--tracking-normal: var(--tracking-normal);
|
||||
--tracking-wide: calc(var(--tracking-normal) + 0.025em);
|
||||
--tracking-wider: calc(var(--tracking-normal) + 0.05em);
|
||||
--tracking-widest: calc(var(--tracking-normal) + 0.1em);
|
||||
}
|
||||
|
||||
body {
|
||||
letter-spacing: var(--tracking-normal);
|
||||
}
|
||||
Reference in New Issue
Block a user