feat(css): ♿ better accessibility with high contrast dark mode
This commit is contained in:
parent
e1e462b7ca
commit
b5b37b173f
|
@ -68,7 +68,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
:root:has(body:not([data-theme='light'])) {
|
:root:has(body:not([data-theme='light'])) {
|
||||||
--_font-color: var(--choco-1);
|
--_font-color: var(--choco-1);
|
||||||
|
@ -83,6 +82,26 @@
|
||||||
--_background-color: var(--sand-12);
|
--_background-color: var(--sand-12);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (prefers-contrast: more) and (prefers-color-scheme: dark) {
|
||||||
|
:root:has(body:not([data-theme='light'])) {
|
||||||
|
--_font-color: white;
|
||||||
|
--_accent-color: var(--lime-9);
|
||||||
|
--_translucent: var(--sand-10);
|
||||||
|
--_background-color: black;
|
||||||
|
--_background-image: '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-contrast: more) {
|
||||||
|
:root:has(body[data-theme='dark']) {
|
||||||
|
--_font-color: white;
|
||||||
|
--_accent-color: var(--lime-9);
|
||||||
|
--_translucent: var(--sand-10);
|
||||||
|
--_background-color: black;
|
||||||
|
--_background-image: '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
color: var(--_font-color);
|
color: var(--_font-color);
|
||||||
font-family: var(--_font-family);
|
font-family: var(--_font-family);
|
||||||
|
|
Loading…
Reference in a new issue