mirror of
https://github.com/soconnor0919/hristudio.git
synced 2025-12-11 22:54:45 -05:00
107 lines
3.1 KiB
CSS
107 lines
3.1 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
body {
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
@layer base {
|
|
:root {
|
|
--background: 210 50% 98%;
|
|
--foreground: 215 25% 27%;
|
|
--card: 210 50% 98%; /* Card background color */
|
|
--card-foreground: 215 25% 27%; /* Card text color */
|
|
--popover: 210 50% 98%;
|
|
--popover-foreground: 215 25% 27%;
|
|
--primary: 215 60% 40%;
|
|
--primary-foreground: 210 50% 98%;
|
|
--secondary: 210 55% 92%;
|
|
--secondary-foreground: 215 25% 27%;
|
|
--muted: 210 55% 92%;
|
|
--muted-foreground: 215 20% 50%;
|
|
--accent: 210 55% 92%;
|
|
--accent-foreground: 215 25% 27%;
|
|
--destructive: 0 84% 60%;
|
|
--destructive-foreground: 210 50% 98%;
|
|
--border: 214 32% 91%;
|
|
--input: 214 32% 91%;
|
|
--ring: 215 60% 40%;
|
|
--radius: 0.5rem;
|
|
|
|
/* Update gradient variables */
|
|
--gradient-start: 210 50% 96%;
|
|
--gradient-end: 210 50% 98%;
|
|
|
|
/* Update sidebar variables */
|
|
--sidebar-background-top: 210 55% 92%;
|
|
--sidebar-background-bottom: 210 55% 88%;
|
|
--sidebar-foreground: 215 25% 27%;
|
|
--sidebar-muted: 215 20% 50%;
|
|
--sidebar-hover: 210 60% 86%;
|
|
|
|
--card-level-1: 210 50% 95%; /* Level 1 card background color */
|
|
--card-level-2: 210 50% 90%; /* Level 2 card background color */
|
|
--card-level-3: 210 50% 85%; /* Level 3 card background color */
|
|
}
|
|
|
|
.dark {
|
|
--background: 220 20% 15%; /* Dark mode background */
|
|
--foreground: 220 20% 90%; /* Dark mode foreground */
|
|
--card: 220 20% 15%; /* Dark mode card background color */
|
|
--card-foreground: 220 20% 90%; /* Dark mode card text color */
|
|
--popover: 220 20% 15%;
|
|
--popover-foreground: 220 20% 90%;
|
|
--primary: 220 60% 50%;
|
|
--primary-foreground: 220 20% 90%;
|
|
--secondary: 220 30% 20%; /* Darker secondary */
|
|
--secondary-foreground: 220 20% 90%;
|
|
--muted: 220 30% 20%;
|
|
--muted-foreground: 220 20% 70%;
|
|
--accent: 220 30% 20%;
|
|
--accent-foreground: 220 20% 90%;
|
|
--destructive: 0 62% 40%; /* Darker destructive */
|
|
--destructive-foreground: 220 20% 90%;
|
|
--border: 220 30% 20%;
|
|
--input: 220 30% 20%;
|
|
--ring: 220 60% 50%;
|
|
|
|
/* Update gradient variables for dark mode */
|
|
--gradient-start: 220 20% 12%;
|
|
--gradient-end: 220 20% 15%;
|
|
|
|
/* Update sidebar variables for dark mode */
|
|
--sidebar-background-top: 220 20% 15%;
|
|
--sidebar-background-bottom: 220 20% 12%;
|
|
--sidebar-foreground: 220 20% 90%;
|
|
--sidebar-muted: 220 20% 70%;
|
|
--sidebar-hover: 220 30% 20%;
|
|
|
|
--card-level-1: 220 20% 12%; /* Dark mode Level 1 card background color */
|
|
--card-level-2: 220 20% 10%; /* Dark mode Level 2 card background color */
|
|
--card-level-3: 220 20% 8%; /* Dark mode Level 3 card background color */
|
|
}
|
|
|
|
/* Add these utility classes */
|
|
.card-level-1 {
|
|
background-color: hsl(var(--card-level-1));
|
|
}
|
|
|
|
.card-level-2 {
|
|
background-color: hsl(var(--card-level-2));
|
|
}
|
|
|
|
.card-level-3 {
|
|
background-color: hsl(var(--card-level-3));
|
|
}
|
|
}
|
|
|
|
@layer base {
|
|
* {
|
|
@apply border-border;
|
|
}
|
|
body {
|
|
@apply bg-background text-foreground;
|
|
}
|
|
}
|