50 lines
1.5 KiB
SCSS
50 lines
1.5 KiB
SCSS
body {
|
|
--brand-color-rgb: var(--brand-color-r), var(--brand-color-g), var(--brand-color-b);
|
|
--brand-color: rgb(var(--brand-color-rgb));
|
|
--brand-color-faint: rgba(var(--brand-color-rgb), 0.1);
|
|
--brand-color-med: rgba(var(--brand-color-rgb), 0.2);
|
|
--accent-color: rgb(
|
|
calc(var(--brand-color-r) + 25),
|
|
calc(var(--brand-color-g) + 25),
|
|
calc(var(--brand-color-b) + 25)
|
|
);
|
|
--primary-text-color-rgb: var(--primary-text-color-r), var(--primary-text-color-g), var(--primary-text-color-b);
|
|
--primary-text-color: rgb(var(--primary-text-color-rgb));
|
|
--primary-text-color-faint: rgba(var(--primary-text-color-rgb), 0.6);
|
|
}
|
|
|
|
body.theme-mode-light {
|
|
--primary-text-color-r: 0;
|
|
--primary-text-color-g: 0;
|
|
--primary-text-color-b: 0;
|
|
--background-color: #f2f2f2;
|
|
--foreground-color: #ffffff;
|
|
--highlight-text-color: rgb(
|
|
calc(var(--brand-color-r) - 25),
|
|
calc(var(--brand-color-g) - 25),
|
|
calc(var(--brand-color-b) - 25)
|
|
);
|
|
--brand-color-hicontrast: rgb(
|
|
calc(var(--brand-color-r) - 50),
|
|
calc(var(--brand-color-g) - 50),
|
|
calc(var(--brand-color-b) - 50)
|
|
);
|
|
}
|
|
|
|
body.theme-mode-dark {
|
|
--primary-text-color-r: 255;
|
|
--primary-text-color-g: 255;
|
|
--primary-text-color-b: 255;
|
|
--background-color: #333333;
|
|
--foreground-color: #222222;
|
|
--highlight-text-color: rgb(
|
|
calc(var(--brand-color-r) + 25),
|
|
calc(var(--brand-color-g) + 25),
|
|
calc(var(--brand-color-b) + 25)
|
|
);
|
|
--brand-color-hicontrast: rgb(
|
|
calc(var(--brand-color-r) + 50),
|
|
calc(var(--brand-color-g) + 50),
|
|
calc(var(--brand-color-b) + 50)
|
|
);
|
|
}
|