mirror of
https://github.com/walkxcode/dashboard-icons.git
synced 2025-10-27 05:29:03 +08:00
proposition of completely new theme
This commit is contained in:
Thomas Camlong
@@ -42,6 +42,10 @@
|
|||||||
--font-mono: var(--font-mono);
|
--font-mono: var(--font-mono);
|
||||||
--font-serif: var(--font-serif);
|
--font-serif: var(--font-serif);
|
||||||
|
|
||||||
|
/* --font-sans: Open Sans, sans-serif;
|
||||||
|
--font-mono: Menlo, monospace;
|
||||||
|
--font-serif: Georgia, serif; */
|
||||||
|
|
||||||
--radius-sm: calc(var(--radius) - 4px);
|
--radius-sm: calc(var(--radius) - 4px);
|
||||||
--radius-md: calc(var(--radius) - 2px);
|
--radius-md: calc(var(--radius) - 2px);
|
||||||
--radius-lg: var(--radius);
|
--radius-lg: var(--radius);
|
||||||
@@ -118,102 +122,173 @@
|
|||||||
transform: rotate(-5deg) scale(0.9);
|
transform: rotate(-5deg) scale(0.9);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
--radius: 0.3rem;
|
||||||
|
|
||||||
|
--tracking-tighter: calc(var(--tracking-normal) - 0.05em);
|
||||||
|
|
||||||
|
--tracking-tight: calc(var(--tracking-normal) - 0.025em);
|
||||||
|
|
||||||
|
--tracking-wide: calc(var(--tracking-normal) + 0.025em);
|
||||||
|
|
||||||
|
--tracking-wider: calc(var(--tracking-normal) + 0.05em);
|
||||||
|
|
||||||
|
--tracking-widest: calc(var(--tracking-normal) + 0.1em);
|
||||||
|
|
||||||
|
--tracking-normal: var(--tracking-normal);
|
||||||
|
|
||||||
|
--spacing: var(--spacing);
|
||||||
|
|
||||||
|
--letter-spacing: var(--letter-spacing);
|
||||||
|
|
||||||
|
--shadow-offset-y: var(--shadow-offset-y);
|
||||||
|
|
||||||
|
--shadow-offset-x: var(--shadow-offset-x);
|
||||||
|
|
||||||
|
--shadow-spread: var(--shadow-spread);
|
||||||
|
|
||||||
|
--shadow-blur: var(--shadow-blur);
|
||||||
|
|
||||||
|
--shadow-opacity: var(--shadow-opacity);
|
||||||
|
|
||||||
|
--color-shadow-color: var(--shadow-color)
|
||||||
}
|
}
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--radius: 0.2rem;
|
--radius: 0.3rem;
|
||||||
|
|
||||||
--background: oklch(0.99 0 0);
|
--background: oklch(1.0000 0 0);
|
||||||
--foreground: oklch(0.32 0 0);
|
--foreground: oklch(0.1884 0.0128 248.5103);
|
||||||
--card: oklch(1 0 0);
|
--card: oklch(0.9784 0.0011 197.1387);
|
||||||
--card-foreground: oklch(0.32 0 0);
|
--card-foreground: oklch(0.1884 0.0128 248.5103);
|
||||||
--popover: oklch(1 0 0);
|
--popover: oklch(1.0000 0 0);
|
||||||
--popover-foreground: oklch(0.32 0 0);
|
--popover-foreground: oklch(0.1884 0.0128 248.5103);
|
||||||
--primary: oklch(0.67 0.2 23.8);
|
--primary: oklch(0.6723 0.1606 244.9955);
|
||||||
--primary-foreground: oklch(1 0 0);
|
--primary-foreground: oklch(1.0000 0 0);
|
||||||
--secondary: oklch(0.97 0 264.54);
|
--secondary: oklch(0.1884 0.0128 248.5103);
|
||||||
--secondary-foreground: oklch(0.45 0.03 256.8);
|
--secondary-foreground: oklch(0.45 0.03 256.8);
|
||||||
--muted: oklch(0.98 0 247.84);
|
--muted: oklch(0.98 0 247.84);
|
||||||
--muted-foreground: oklch(0.55 0.02 264.36);
|
--muted-foreground: oklch(0.55 0.02 264.36);
|
||||||
--accent: oklch(0.967 0.001 286.375);
|
--accent: oklch(0.9392 0.0166 250.8453);
|
||||||
--accent-foreground: oklch(0.21 0.006 285.885);
|
--accent-foreground: oklch(0.6723 0.1606 244.9955);
|
||||||
--destructive: oklch(0.64 0.21 25.33);
|
--destructive: oklch(0.6188 0.2376 25.7658);
|
||||||
--destructive-foreground: oklch(1 0 0);
|
--destructive-foreground: oklch(1.0000 0 0);
|
||||||
--border: oklch(0.9 0.01 247.88);
|
--border: oklch(0.9317 0.0118 231.6594);
|
||||||
|
|
||||||
--input: oklch(0.92 0.004 286.32);
|
--input: oklch(0.9809 0.0025 228.7836);
|
||||||
|
|
||||||
--chart-1: oklch(0.646 0.222 41.116);
|
--chart-1: oklch(0.6723 0.1606 244.9955);
|
||||||
--chart-2: oklch(0.6 0.118 184.704);
|
--chart-2: oklch(0.6907 0.1554 160.3454);
|
||||||
--chart-3: oklch(0.398 0.07 227.392);
|
--chart-3: oklch(0.8214 0.1600 82.5337);
|
||||||
--chart-4: oklch(0.828 0.189 84.429);
|
--chart-4: oklch(0.7064 0.1822 151.7125);
|
||||||
--chart-5: oklch(0.769 0.188 70.08);
|
--chart-5: oklch(0.5919 0.2186 10.5826);
|
||||||
--sidebar: oklch(0.985 0 0);
|
--sidebar: oklch(0.9784 0.0011 197.1387);
|
||||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
--sidebar-foreground: oklch(0.1884 0.0128 248.5103);
|
||||||
--sidebar-primary: oklch(0.637 0.237 25.331);
|
--sidebar-primary: oklch(0.6723 0.1606 244.9955);
|
||||||
--sidebar-primary-foreground: oklch(0.971 0.013 17.38);
|
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||||
--sidebar-accent: oklch(0.967 0.001 286.375);
|
--sidebar-accent: oklch(0.9392 0.0166 250.8453);
|
||||||
--sidebar-accent-foreground: oklch(0.21 0.006 285.885);
|
--sidebar-accent-foreground: oklch(0.6723 0.1606 244.9955);
|
||||||
--sidebar-border: oklch(0.92 0.004 286.32);
|
--sidebar-border: oklch(0.9271 0.0101 238.5177);
|
||||||
--sidebar-ring: oklch(0.637 0.237 25.331);
|
--sidebar-ring: oklch(0.6818 0.1584 243.3540);
|
||||||
|
|
||||||
--shadow-2xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
|
--shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||||
--shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
|
--shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||||
--shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 2px 4px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 4px 6px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 8px 10px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.25);
|
--shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||||
|
|
||||||
--magic-gradient-color: oklch(0.67 0.2 23.8 / 15%);
|
--magic-gradient-color: oklch(0.6723 0.1606 244.9955 / 15%);
|
||||||
|
|
||||||
|
--ring: oklch(0.6818 0.1584 243.3540);
|
||||||
|
|
||||||
|
--font-sans: Open Sans, sans-serif;
|
||||||
|
|
||||||
|
--font-serif: Georgia, serif;
|
||||||
|
|
||||||
|
--font-mono: Menlo, monospace;
|
||||||
|
|
||||||
|
--shadow-color: rgba(29,161,242,0.15);
|
||||||
|
|
||||||
|
--shadow-opacity: 0;
|
||||||
|
|
||||||
|
--shadow-blur: 0px;
|
||||||
|
|
||||||
|
--shadow-spread: 0px;
|
||||||
|
|
||||||
|
--shadow-offset-x: 0px;
|
||||||
|
|
||||||
|
--shadow-offset-y: 2px;
|
||||||
|
|
||||||
|
--letter-spacing: 0em;
|
||||||
|
|
||||||
|
--spacing: 0.25rem;
|
||||||
|
|
||||||
|
--tracking-normal: 0em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dark {
|
.dark {
|
||||||
--background: oklch(0.141 0.005 285.823);
|
--background: oklch(0 0 0);
|
||||||
--foreground: oklch(0.92 0 0);
|
--foreground: oklch(0.9328 0.0025 228.7857);
|
||||||
--card: oklch(0.31 0.03 268.64);
|
--card: oklch(0.2097 0.0080 274.5332);
|
||||||
--card-foreground: oklch(0.92 0 0);
|
--card-foreground: oklch(0.8853 0 0);
|
||||||
--popover: oklch(0.29 0.02 268.4);
|
--popover: oklch(0 0 0);
|
||||||
--popover-foreground: oklch(0.92 0 0);
|
--popover-foreground: oklch(0.9328 0.0025 228.7857);
|
||||||
--primary: oklch(0.67 0.2 23.8);
|
--primary: oklch(0.6700 0.2000 23.8000);
|
||||||
--primary-foreground: oklch(1 0 0);
|
--primary-foreground: oklch(1.0000 0 0);
|
||||||
--secondary: oklch(0.31 0.03 266.71);
|
--secondary: oklch(0.9622 0.0035 219.5331);
|
||||||
--secondary-foreground: oklch(0.92 0 0);
|
--secondary-foreground: oklch(0.1884 0.0128 248.5103);
|
||||||
--muted: oklch(0.31 0.03 266.71);
|
--muted: oklch(0.31 0.03 266.71);
|
||||||
--muted-foreground: oklch(0.78 0 0);
|
--muted-foreground: oklch(0.78 0 0);
|
||||||
--accent: oklch(0.34 0.06 267.59);
|
--accent: oklch(0.1928 0.0331 242.5459);
|
||||||
--accent-foreground: oklch(0.88 0.06 254.13);
|
--accent-foreground: oklch(0.6448 0.2290 20.4673);
|
||||||
--destructive: oklch(0.64 0.21 25.33);
|
--destructive: oklch(0.6188 0.2376 25.7658);
|
||||||
--destructive-foreground: oklch(1 0 0);
|
--destructive-foreground: oklch(1.0000 0 0);
|
||||||
--border: oklch(0.38 0.03 269.73);
|
--border: oklch(0.38 0.03 269.73);
|
||||||
|
|
||||||
--input: oklch(1 0 0 / 15%);
|
--input: oklch(0.3020 0.0288 244.8244);
|
||||||
--ring: oklch(0.637 0.237 25.331);
|
--ring: oklch(0.6700 0.2000 23.8000);
|
||||||
--chart-1: oklch(0.488 0.243 264.376);
|
--chart-1: oklch(0.6723 0.1606 244.9955);
|
||||||
--chart-2: oklch(0.696 0.17 162.48);
|
--chart-2: oklch(0.6907 0.1554 160.3454);
|
||||||
--chart-3: oklch(0.769 0.188 70.08);
|
--chart-3: oklch(0.8214 0.1600 82.5337);
|
||||||
--chart-4: oklch(0.627 0.265 303.9);
|
--chart-4: oklch(0.7064 0.1822 151.7125);
|
||||||
--chart-5: oklch(0.645 0.246 16.439);
|
--chart-5: oklch(0.5919 0.2186 10.5826);
|
||||||
--sidebar: oklch(0.21 0.006 285.885);
|
--sidebar: oklch(0.2097 0.0080 274.5332);
|
||||||
--sidebar-foreground: oklch(0.985 0 0);
|
--sidebar-foreground: oklch(0.8853 0 0);
|
||||||
--sidebar-primary: oklch(0.637 0.237 25.331);
|
--sidebar-primary: oklch(0.6700 0.2000 23.8000);
|
||||||
--sidebar-primary-foreground: oklch(0.971 0.013 17.38);
|
--sidebar-primary-foreground: oklch(1.0000 0 0);
|
||||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
--sidebar-accent: oklch(0.1928 0.0331 242.5459);
|
||||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
--sidebar-accent-foreground: oklch(0.5869 0.2251 31.5657);
|
||||||
--sidebar-border: oklch(1 0 0 / 10%);
|
--sidebar-border: oklch(0.3795 0.0220 240.5943);
|
||||||
--sidebar-ring: oklch(0.637 0.237 25.331);
|
--sidebar-ring: oklch(0.4952 0.1902 31.5028);
|
||||||
|
|
||||||
--shadow-2xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
|
--shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||||
--shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
|
--shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||||
--shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 2px 4px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 4px 6px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 8px 10px -1px hsl(0 0% 0% / 0.1);
|
--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 1px 3px 0px hsl(0 0% 0% / 0.25);
|
--shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
|
||||||
|
|
||||||
|
--magic-gradient-color: oklch(0.67 0.2 23.8 / 15%);
|
||||||
|
|
||||||
|
--radius: 0.3rem;
|
||||||
|
|
||||||
|
--shadow-color: rgba(29,161,242,0.25);
|
||||||
|
|
||||||
|
--shadow-opacity: 0;
|
||||||
|
|
||||||
|
--shadow-blur: 0px;
|
||||||
|
|
||||||
|
--shadow-spread: 0px;
|
||||||
|
|
||||||
|
--shadow-offset-x: 0px;
|
||||||
|
|
||||||
|
--shadow-offset-y: 2px;
|
||||||
|
|
||||||
--magic-gradient-color: oklch(0.27 0 0);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@layer base {
|
@layer base {
|
||||||
@@ -222,6 +297,7 @@
|
|||||||
}
|
}
|
||||||
body {
|
body {
|
||||||
@apply bg-background text-foreground;
|
@apply bg-background text-foreground;
|
||||||
|
letter-spacing: var(--tracking-normal);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user