mirror of
https://code.castopod.org/adaures/castopod
synced 2025-05-10 16:25:47 +00:00
a746a781b4
- set new colors using the css variables for theming in tailwind.config.js - replace admin and public colors with new variable enabled colors
81 lines
2.2 KiB
CSS
81 lines
2.2 KiB
CSS
/*
|
|
--color-brand-lighter: hsl(173 44% 96%);
|
|
--color-brand-light: hsl(111 64% 94%);
|
|
--color-brand-base: hsl(174 100% 29%);
|
|
--color-brand-dark: hsl(172 100% 17%);
|
|
--color-brand-darker: hsl(131 100% 12%);
|
|
|
|
--color-background-elevated: hsl(0 0% 100%);
|
|
--color-background-base: hsl(173 44% 96%);
|
|
|
|
--color-text-base: hsl(240 17% 2%);
|
|
--color-text-muted: hsl(240 8% 63%);
|
|
--color-text-inverted: hsl(0 0% 100%);
|
|
|
|
--color-brand-lighter: 173 44% 96%;
|
|
--color-brand-light: 111 64% 94%;
|
|
--color-brand-base: 174 100% 29%;
|
|
--color-brand-dark: 172 100% 17%;
|
|
--color-brand-darker: 131 100% 12%;
|
|
|
|
--color-background-elevated: 0 0% 100%;
|
|
--color-background-base: 173 44% 96%;
|
|
|
|
--color-text-base: 240 17% 2%;
|
|
--color-text-muted: 240 8% 63%;
|
|
--color-text-inverted: 0 0% 100%;
|
|
*/
|
|
|
|
/*
|
|
--color-accent-base: 0 100% 38%;
|
|
--color-accent-hover: 0 100% 48%;
|
|
--color-accent-muted: 0 8% 63%;
|
|
|
|
--color-heading-foreground: 0 64% 94%;
|
|
--color-heading-background: 0 100% 17%;
|
|
|
|
--color-background-elevated: 209 35% 15%;
|
|
--color-background-base: 210 34% 13%;
|
|
--color-background-navigation: 210 34% 11%;
|
|
--color-background-header: 200 38% 15%;
|
|
--color-background-highlight: 200 38% 25%;
|
|
--color-background-backdrop: 0 0% 50%;
|
|
|
|
--color-border-subtle: 240 8% 27%;
|
|
--color-border-contrast: 240 8% 78%;
|
|
--color-border-navigation: 210 34% 4%;
|
|
|
|
--color-text-base: 240 17% 100%;
|
|
--color-text-muted: 240 8% 63%;
|
|
*/
|
|
|
|
@layer base {
|
|
:root {
|
|
--color-accent-base: 174 100% 29%;
|
|
--color-accent-hover: 172 100% 17%;
|
|
--color-accent-muted: 131 100% 12%;
|
|
--color-accent-contrast: 0 0% 100%;
|
|
|
|
--color-heading-foreground: 172 100% 17%;
|
|
--color-heading-background: 111 64% 94%;
|
|
|
|
--color-background-elevated: 0 0% 100%;
|
|
--color-background-base: 173 44% 96%;
|
|
--color-background-navigation: 172 100% 17%;
|
|
--color-background-header: 172 100% 17%;
|
|
--color-background-highlight: 111 64% 94%;
|
|
--color-background-backdrop: 0 0% 50%;
|
|
|
|
--color-border-subtle: 111 42% 86%;
|
|
--color-border-contrast: 0 0% 0%;
|
|
--color-border-navigation: 131 100% 12%;
|
|
|
|
--color-text-base: 158 8% 3%;
|
|
--color-text-muted: 172 8% 38%;
|
|
}
|
|
|
|
body {
|
|
color: hsl(var(--color-text-base));
|
|
}
|
|
}
|