kin-arai-dee/app/globals.css

121 lines
4.3 KiB
CSS

@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
:root {
--background: 210 16.6667% 97.6471%;
--foreground: 240 41.4634% 8.0392%;
--card: 0 0% 100%;
--card-foreground: 240 41.4634% 8.0392%;
--popover: 0 0% 100%;
--popover-foreground: 240 41.4634% 8.0392%;
--primary: 312.9412 100% 50%;
--primary-foreground: 0 0% 100%;
--secondary: 240 100% 97.0588%;
--secondary-foreground: 240 41.4634% 8.0392%;
--muted: 240 100% 97.0588%;
--muted-foreground: 240 41.4634% 8.0392%;
--accent: 168 100% 50%;
--accent-foreground: 240 41.4634% 8.0392%;
--destructive: 14.3529 100% 50%;
--destructive-foreground: 0 0% 100%;
--border: 198 18.5185% 89.4118%;
--input: 198 18.5185% 89.4118%;
--ring: 312.9412 100% 50%;
--chart-1: 312.9412 100% 50%;
--chart-2: 273.8824 100% 50%;
--chart-3: 186.1176 100% 50%;
--chart-4: 168 100% 50%;
--chart-5: 54.1176 100% 50%;
--sidebar: 240 100% 97.0588%;
--sidebar-foreground: 240 41.4634% 8.0392%;
--sidebar-primary: 312.9412 100% 50%;
--sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 168 100% 50%;
--sidebar-accent-foreground: 240 41.4634% 8.0392%;
--sidebar-border: 198 18.5185% 89.4118%;
--sidebar-ring: 312.9412 100% 50%;
--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-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.1),
0px 1px 2px -3px hsl(0 0% 0% / 0.1);
--shadow: 0px 4px 8px -2px hsl(0 0% 0% / 0.1),
0px 1px 2px -3px hsl(0 0% 0% / 0.1);
--shadow-md: 0px 4px 8px -2px hsl(0 0% 0% / 0.1),
0px 2px 4px -3px hsl(0 0% 0% / 0.1);
--shadow-lg: 0px 4px 8px -2px hsl(0 0% 0% / 0.1),
0px 4px 6px -3px hsl(0 0% 0% / 0.1);
--shadow-xl: 0px 4px 8px -2px hsl(0 0% 0% / 0.1),
0px 8px 10px -3px hsl(0 0% 0% / 0.1);
--shadow-2xl: 0px 4px 8px -2px hsl(0 0% 0% / 0.25);
--tracking-normal: 0em;
--spacing: 0.25rem;
}
.dark {
--background: 240 41.4634% 8.0392%;
--foreground: 217.5 26.6667% 94.1176%;
--card: 240 35.4839% 18.2353%;
--card-foreground: 217.5 26.6667% 94.1176%;
--popover: 240 35.4839% 18.2353%;
--popover-foreground: 217.5 26.6667% 94.1176%;
--primary: 312.9412 100% 50%;
--primary-foreground: 0 0% 100%;
--secondary: 240 35.4839% 18.2353%;
--secondary-foreground: 217.5 26.6667% 94.1176%;
--muted: 240 35.4839% 18.2353%;
--muted-foreground: 232.1053 17.5926% 57.6471%;
--accent: 168 100% 50%;
--accent-foreground: 240 41.4634% 8.0392%;
--destructive: 14.3529 100% 50%;
--destructive-foreground: 0 0% 100%;
--border: 240 34.2857% 27.451%;
--input: 240 34.2857% 27.451%;
--ring: 312.9412 100% 50%;
--chart-1: 312.9412 100% 50%;
--chart-2: 273.8824 100% 50%;
--chart-3: 186.1176 100% 50%;
--chart-4: 168 100% 50%;
--chart-5: 54.1176 100% 50%;
--sidebar: 240 41.4634% 8.0392%;
--sidebar-foreground: 217.5 26.6667% 94.1176%;
--sidebar-primary: 312.9412 100% 50%;
--sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 168 100% 50%;
--sidebar-accent-foreground: 240 41.4634% 8.0392%;
--sidebar-border: 240 34.2857% 27.451%;
--sidebar-ring: 312.9412 100% 50%;
--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-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.1),
0px 1px 2px -3px hsl(0 0% 0% / 0.1);
--shadow: 0px 4px 8px -2px hsl(0 0% 0% / 0.1),
0px 1px 2px -3px hsl(0 0% 0% / 0.1);
--shadow-md: 0px 4px 8px -2px hsl(0 0% 0% / 0.1),
0px 2px 4px -3px hsl(0 0% 0% / 0.1);
--shadow-lg: 0px 4px 8px -2px hsl(0 0% 0% / 0.1),
0px 4px 6px -3px hsl(0 0% 0% / 0.1);
--shadow-xl: 0px 4px 8px -2px hsl(0 0% 0% / 0.1),
0px 8px 10px -3px hsl(0 0% 0% / 0.1);
--shadow-2xl: 0px 4px 8px -2px hsl(0 0% 0% / 0.25);
}
}
@layer base {
* {
@apply border-border;
}
body {
@apply bg-background text-foreground;
}
}