fix light/dark theme switch
This commit is contained in:
parent
53e70c33c7
commit
84bdac8e87
1 changed files with 23 additions and 18 deletions
|
@ -462,6 +462,24 @@ pre { line-height: 1em; }
|
||||||
--hl: var(--o);
|
--hl: var(--o);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* dark preferred */
|
||||||
|
@media (prefers-color-scheme: dark)
|
||||||
|
{
|
||||||
|
:root {
|
||||||
|
--bg: black;
|
||||||
|
--rbg: var(--b03);
|
||||||
|
--fg: var(--b1);
|
||||||
|
--fg0: var(--b00);
|
||||||
|
--rfg: var(--b2);
|
||||||
|
--hl: var(--y);
|
||||||
|
}
|
||||||
|
img { filter: brightness(0.7) saturate(0.5); }
|
||||||
|
pre {
|
||||||
|
background: hsl(210,40%,15%);
|
||||||
|
border-color: hsl(210,15%,43%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* light checked */
|
/* light checked */
|
||||||
input#l:checked ~ div {
|
input#l:checked ~ div {
|
||||||
--bg: var(--b3);
|
--bg: var(--b3);
|
||||||
|
@ -474,6 +492,10 @@ input#l:checked ~ div {
|
||||||
input#l:checked ~ div img {
|
input#l:checked ~ div img {
|
||||||
filter: none;
|
filter: none;
|
||||||
}
|
}
|
||||||
|
input#l:checked ~ div pre {
|
||||||
|
border: 1px solid hsl(210, 15%, 49%);
|
||||||
|
background: hsl(210, 40%, 96%);
|
||||||
|
}
|
||||||
|
|
||||||
/* dark checked */
|
/* dark checked */
|
||||||
input#d:checked ~ div {
|
input#d:checked ~ div {
|
||||||
|
@ -489,26 +511,9 @@ input#d:checked ~ div img {
|
||||||
}
|
}
|
||||||
input#d:checked ~ div pre {
|
input#d:checked ~ div pre {
|
||||||
background: hsl(210,40%,15%);
|
background: hsl(210,40%,15%);
|
||||||
border: hsl(210,15%,43%);
|
border-color: hsl(210,15%,43%);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* dark preferred */
|
|
||||||
@media (prefers-color-scheme: dark)
|
|
||||||
{
|
|
||||||
:root {
|
|
||||||
--bg: black;
|
|
||||||
--rbg: var(--b03);
|
|
||||||
--fg: var(--b1);
|
|
||||||
--fg0: var(--b00);
|
|
||||||
--rfg: var(--b2);
|
|
||||||
--hl: var(--y);
|
|
||||||
}
|
|
||||||
img { filter: brightness(0.7) saturate(0.5); }
|
|
||||||
pre {
|
|
||||||
background: hsl(210,40%,15%);
|
|
||||||
border: hsl(210,15%,43%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
body, body > div {
|
body, body > div {
|
||||||
background: var(--bg);
|
background: var(--bg);
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
|
|
Loading…
Reference in a new issue