Files
blog/src/styles/vars.css

35 lines
1.1 KiB
CSS

:root {
--content-size: 1.25rem;
--content-size-sm: 1rem;
--content-line-height: 1.5;
--content-width: 52.5rem;
--content-padding: 0.65rem;
--bg-color: hsl(0deg 0% 100%);
--content-color: hsl(0deg 0% 20%);
--content-color-faded: #555;
--heading-color: hsl(0deg 0% 27%);
--primary-color: hsl(202deg 72% 28%);
--primary-color-faded: hsl(202deg 14% 36%);
--accent-color: hsl(0deg 92% 29%);
--accent-color-faded: hsl(0deg 25% 55%);
--nav-hover: hsl(0deg 0% 0% / 10%);
@media(max-width: 640px) {
--content-line-height: 1.25;
--content-size: 1.15rem;
--content-size-sm: 0.9rem;
}
@media(prefers-color-scheme: dark) {
--bg-color: hsl(160deg 15% 9%);
--content-color: hsl(100deg 8% 78%);
--content-color-faded: hsl(110deg 5% 52%);
--heading-color: hsl(45deg 20% 90%);
--primary-color: hsl(155deg 30% 35%);
--primary-color-faded: hsl(155deg 20% 14%);
--accent-color: hsl(340deg 45% 65%);
--accent-color-faded: hsl(340deg 20% 50%);
--nav-hover: hsl(155deg 15% 100% / 10%);
}
}