feat: Add comprehensive theme management with mode and color selectors, alongside new fonts.

This commit is contained in:
2025-11-27 23:31:10 -05:00
parent 0809f75673
commit 10e1ca8396
6 changed files with 188 additions and 9 deletions
+75 -2
View File
@@ -1,8 +1,7 @@
@import "tailwindcss";
@import "tw-animate-css";
:root {
--background: oklch(0.98 0.01 230);
.theme-ocean {
--foreground: oklch(0.2 0.03 230);
--card: oklch(1 0 0);
--card-foreground: oklch(0.2 0.03 230);
@@ -240,6 +239,80 @@
--navbar-border: oklch(0.88 0.02 140);
}
.dark .theme-sunset {
--background: oklch(0.15 0.05 40);
--foreground: oklch(0.9 0.05 40);
--card: oklch(0.2 0.05 40);
--card-foreground: oklch(0.9 0.05 40);
--popover: oklch(0.22 0.05 40);
--popover-foreground: oklch(0.9 0.05 40);
--primary: oklch(0.7 0.2 50);
--primary-foreground: oklch(0.1 0.05 40);
--secondary: oklch(0.25 0.05 40);
--secondary-foreground: oklch(0.9 0.05 40);
--muted: oklch(0.25 0.05 40);
--muted-foreground: oklch(0.7 0.05 40);
--accent: oklch(0.3 0.05 40);
--accent-foreground: oklch(0.9 0.05 40);
--destructive: oklch(0.7 0.19 22);
--destructive-foreground: oklch(0.2 0.05 40);
--success: oklch(0.6 0.15 142);
--success-foreground: oklch(0.98 0.01 140);
--warning: oklch(0.7 0.15 38);
--warning-foreground: oklch(0.2 0.05 40);
--border: oklch(0.28 0.05 40);
--input: oklch(0.35 0.05 40);
--ring: oklch(0.7 0.2 50);
--sidebar: oklch(0.1 0.05 40);
--sidebar-foreground: oklch(0.9 0.05 40);
--sidebar-primary: oklch(0.9 0.05 40);
--sidebar-primary-foreground: oklch(0.1 0.05 40);
--sidebar-accent: oklch(0.2 0.05 40);
--sidebar-accent-foreground: oklch(0.9 0.05 40);
--sidebar-border: oklch(0.25 0.05 40);
--sidebar-ring: oklch(0.35 0.05 40);
--navbar: oklch(0.1 0.05 40);
--navbar-foreground: oklch(0.9 0.05 40);
--navbar-border: oklch(0.25 0.05 40);
}
.dark .theme-forest {
--background: oklch(0.15 0.05 140);
--foreground: oklch(0.9 0.05 140);
--card: oklch(0.2 0.05 140);
--card-foreground: oklch(0.9 0.05 140);
--popover: oklch(0.22 0.05 140);
--popover-foreground: oklch(0.9 0.05 140);
--primary: oklch(0.5 0.1 150);
--primary-foreground: oklch(0.1 0.05 140);
--secondary: oklch(0.25 0.05 140);
--secondary-foreground: oklch(0.9 0.05 140);
--muted: oklch(0.25 0.05 140);
--muted-foreground: oklch(0.7 0.05 140);
--accent: oklch(0.3 0.05 140);
--accent-foreground: oklch(0.9 0.05 140);
--destructive: oklch(0.7 0.19 22);
--destructive-foreground: oklch(0.2 0.05 140);
--success: oklch(0.6 0.15 142);
--success-foreground: oklch(0.98 0.01 140);
--warning: oklch(0.7 0.15 38);
--warning-foreground: oklch(0.2 0.05 140);
--border: oklch(0.28 0.05 140);
--input: oklch(0.35 0.05 140);
--ring: oklch(0.5 0.1 150);
--sidebar: oklch(0.1 0.05 140);
--sidebar-foreground: oklch(0.9 0.05 140);
--sidebar-primary: oklch(0.9 0.05 140);
--sidebar-primary-foreground: oklch(0.1 0.05 140);
--sidebar-accent: oklch(0.2 0.05 140);
--sidebar-accent-foreground: oklch(0.9 0.05 140);
--sidebar-border: oklch(0.25 0.05 140);
--sidebar-ring: oklch(0.35 0.05 140);
--navbar: oklch(0.1 0.05 140);
--navbar-foreground: oklch(0.9 0.05 140);
--navbar-border: oklch(0.25 0.05 140);
}
@theme inline {
--color-background: var(--background);
--color-foreground: var(--foreground);