93 lines
2.1 KiB
CSS
93 lines
2.1 KiB
CSS
@import "tailwindcss";
|
|
@plugin 'tailwindcss-animate';
|
|
|
|
@custom-variant dark (&:is(.dark *));
|
|
|
|
@theme {
|
|
--color-duck-yellow: var(--duck-yellow);
|
|
--color-duck-orange: var(--duck-orange);
|
|
--color-duck-teal: var(--duck-teal);
|
|
--color-duck-forest: var(--duck-forest);
|
|
--color-duck-dark: var(--duck-dark);
|
|
--color-duck-beige: var(--duck-beige);
|
|
|
|
--color-background: hsl(var(--background));
|
|
--color-foreground: hsl(var(--foreground));
|
|
|
|
--color-primary: hsl(var(--primary));
|
|
--color-primary-foreground: hsl(var(--primary-foreground));
|
|
|
|
--color-muted: hsl(var(--muted));
|
|
--color-muted-foreground: hsl(var(--muted-foreground));
|
|
|
|
--color-input: hsl(var(--input));
|
|
--color-ring: hsl(var(--ring));
|
|
|
|
--radius-lg: var(--radius);
|
|
--radius-md: calc(var(--radius) - 2px);
|
|
--radius-sm: calc(var(--radius) - 4px);
|
|
}
|
|
|
|
@layer base {
|
|
:root {
|
|
--duck-yellow: #F4C430;
|
|
--duck-orange: #EA580C;
|
|
--duck-teal: #0891B2;
|
|
--duck-forest: #166534;
|
|
--duck-dark: #14532D;
|
|
--duck-beige: #E7D4B5;
|
|
|
|
--pixel-grid-color: rgba(20, 83, 45, 0.1);
|
|
|
|
--card-bg: rgba(255, 255, 255, 0.9);
|
|
--card-grid-color: rgba(20, 83, 45, 0.08);
|
|
|
|
--background: 0 0% 100%;
|
|
--foreground: 222.2 84% 4.9%;
|
|
|
|
--primary: 222.2 47.4% 11.2%;
|
|
--primary-foreground: 210 40% 98%;
|
|
|
|
--muted: 210 40% 96.1%;
|
|
--muted-foreground: 215.4 16.3% 46.9%;
|
|
|
|
--input: 214.3 31.8% 91.4%;
|
|
--ring: 222.2 84% 4.9%;
|
|
|
|
--radius: 0.5rem;
|
|
}
|
|
|
|
.dark {
|
|
--duck-teal: #22d3ee;
|
|
--duck-dark: #f1f5f9;
|
|
--duck-forest: #4ade80;
|
|
--duck-beige: #292524;
|
|
|
|
--pixel-grid-color: rgba(200, 230, 210, 0.08);
|
|
|
|
--card-bg: rgba(10, 20, 15, 0.9);
|
|
--card-grid-color: rgba(200, 230, 210, 0.06);
|
|
|
|
--background: 222.2 84% 4.9%;
|
|
--foreground: 210 40% 98%;
|
|
|
|
--primary: 210 40% 98%;
|
|
--primary-foreground: 222.2 47.4% 11.2%;
|
|
|
|
--muted: 217.2 32.6% 17.5%;
|
|
--muted-foreground: 215 20.2% 65.1%;
|
|
|
|
--input: 217.2 32.6% 17.5%;
|
|
--ring: 212.7 26.8% 83.9%;
|
|
}
|
|
|
|
html, body {
|
|
@apply bg-background text-foreground;
|
|
margin: 0;
|
|
overflow: hidden;
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|