Spaces:
Sleeping
Sleeping
@tailwind base; | |
@tailwind components; | |
@tailwind utilities; | |
@layer base { | |
:root { | |
--background: 0 0% 100%; | |
--foreground: 240 10% 3.9%; | |
--muted: 240 4.8% 95.9%; | |
--muted-foreground: 240 3.8% 46.1%; | |
--popover: 0 0% 100%; | |
--popover-foreground: 240 10% 3.9%; | |
--card: 0 0% 100%; | |
--card-foreground: 240 10% 3.9%; | |
--border: 240 5.9% 90%; | |
--input: 240 5.9% 90%; | |
--primary: 240 5.9% 10%; | |
--primary-foreground: 0 0% 98%; | |
--secondary: 240 4.8% 95.9%; | |
--secondary-foreground: 240 5.9% 10%; | |
--accent: 240 4.8% 95.9%; | |
--accent-foreground: ; | |
--destructive: 0 84.2% 60.2%; | |
--destructive-foreground: 0 0% 98%; | |
--ring: 240 5% 64.9%; | |
--radius: 0.5rem; | |
} | |
.dark { | |
--background: 240 10% 3.9%; | |
--foreground: 0 0% 98%; | |
--muted: 240 3.7% 15.9%; | |
--muted-foreground: 240 5% 64.9%; | |
--popover: 240 10% 3.9%; | |
--popover-foreground: 0 0% 98%; | |
--card: 240 10% 3.9%; | |
--card-foreground: 0 0% 98%; | |
--border: 240 3.7% 15.9%; | |
--input: 240 3.7% 15.9%; | |
--primary: 0 0% 98%; | |
--primary-foreground: 240 5.9% 10%; | |
--secondary: 240 3.7% 15.9%; | |
--secondary-foreground: 0 0% 98%; | |
--accent: 240 3.7% 15.9%; | |
--accent-foreground: ; | |
--destructive: 0 62.8% 30.6%; | |
--destructive-foreground: 0 85.7% 97.3%; | |
--ring: 240 3.7% 15.9%; | |
} | |
} | |
@layer base { | |
* { | |
@apply border-border; | |
} | |
body { | |
@apply bg-background text-foreground; | |
} | |
} | |
@layer components { | |
.scroll-fade::after { | |
content: ''; | |
position: absolute; | |
bottom: 0; | |
left: 0; | |
right: 0; | |
height: 50px; | |
background: linear-gradient( | |
to bottom, | |
rgba(255, 255, 255, 0), | |
rgba(255, 255, 255, 1) | |
); | |
pointer-events: none; | |
} | |
.scroll-fade:active::after, | |
.scroll-fade:hover::after { | |
background: none; | |
} | |
.image-shadow::after { | |
content: ''; | |
position: absolute; | |
top: 0; | |
right: 0; | |
bottom: 0; | |
left: 0; | |
box-shadow: | |
0 10px 15px -3px rgba(0, 0, 0, 0.1), | |
0 4px 6px -2px rgba(0, 0, 0, 0.05); | |
border-radius: 0.5rem; | |
pointer-events: none; | |
} | |
} | |