53 lines
1.7 KiB
SCSS
53 lines
1.7 KiB
SCSS
body {
|
|
--brand-color_hsl: var(--brand-color_h), var(--brand-color_s), var(--brand-color_l);
|
|
--brand-color: hsl(var(--brand-color_hsl));
|
|
--brand-color--faint: hsla(var(--brand-color_hsl), 0.1);
|
|
--brand-color--med: hsla(var(--brand-color_hsl), 0.2);
|
|
--accent-filter: saturate(1.3) hue-rotate(-20deg) brightness(1.2);
|
|
--accent-filter--hover: saturate(1.3) hue-rotate(-20deg) brightness(1.3);
|
|
--primary-text-color_hsl: var(--primary-text-color_h), var(--primary-text-color_s), var(--primary-text-color_l);
|
|
--primary-text-color: hsl(var(--primary-text-color_hsl));
|
|
--primary-text-color--faint: hsla(var(--primary-text-color_hsl), 0.6);
|
|
--background-color_hsl: var(--background-color_h), var(--background-color_s), var(--background-color_l);
|
|
--background-color: hsl(var(--background-color_hsl));
|
|
}
|
|
|
|
body.theme-mode-light {
|
|
--primary-text-color_h: 0;
|
|
--primary-text-color_s: 0%;
|
|
--primary-text-color_l: 0%;
|
|
--background-color_h: 0;
|
|
--background-color_s: 0%;
|
|
--background-color_l: 94.9%;
|
|
--foreground-color: #ffffff;
|
|
--highlight-text-color: hsl(
|
|
var(--brand-color_h),
|
|
var(--brand-color_s),
|
|
calc(var(--brand-color_l) - 8%)
|
|
);
|
|
--brand-color--hicontrast: hsl(
|
|
var(--brand-color_h),
|
|
var(--brand-color_s),
|
|
calc(var(--brand-color_l) - 12%)
|
|
);
|
|
}
|
|
|
|
body.theme-mode-dark {
|
|
--primary-text-color_h: 0;
|
|
--primary-text-color_s: 0%;
|
|
--primary-text-color_l: 100%;
|
|
--background-color_h: 0;
|
|
--background-color_s: 0%;
|
|
--background-color_l: 20%;
|
|
--foreground-color: #222222;
|
|
--highlight-text-color: hsl(
|
|
var(--brand-color_h),
|
|
var(--brand-color_s),
|
|
calc(var(--brand-color_l) + 8%)
|
|
);
|
|
--brand-color--hicontrast: hsl(
|
|
var(--brand-color_h),
|
|
var(--brand-color_s),
|
|
calc(var(--brand-color_l) + 12%)
|
|
);
|
|
}
|