Finally do dark mode properly
This commit is contained in:
parent
7c0699b583
commit
f1493024ea
|
@ -9,7 +9,7 @@ html {
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
background-color: rgba(255, 255, 255, 0.8);
|
background-color: #fffa;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
border-radius: 1em;
|
border-radius: 1em;
|
||||||
|
@ -29,11 +29,14 @@ input:read-only {
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
background-color: #e0e4cc;
|
background: #e0e4cc;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
border-radius: 0.25em;
|
border-radius: 0.25em;
|
||||||
padding: 0.1em 0.5em;
|
padding: 0.1em 0.5em;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
box-shadow: 0.2em 0.2em 1em rgba(0,0,0,0.1);
|
box-shadow: 0.2em 0.2em 1em #8885;
|
||||||
}
|
}
|
||||||
header * {
|
header * {
|
||||||
margin: 0.2em;
|
margin: 0.2em;
|
||||||
|
@ -62,14 +65,14 @@ h1, h2, h3, h4, h5, h6 {
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #38d;
|
color: #246;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
a:visited {
|
a:visited {
|
||||||
color: #579;
|
color: #479;
|
||||||
}
|
}
|
||||||
a:hover {
|
a:hover {
|
||||||
color: #f83;
|
color: #a52;
|
||||||
}
|
}
|
||||||
|
|
||||||
img.face {
|
img.face {
|
||||||
|
@ -78,12 +81,10 @@ img.face {
|
||||||
}
|
}
|
||||||
|
|
||||||
pre {
|
pre {
|
||||||
background: #e0e4cc;
|
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
blockquote {
|
blockquote {
|
||||||
background: #e0e4cc;
|
|
||||||
padding: 0.1em 1em;
|
padding: 0.1em 1em;
|
||||||
border-radius: 0.4em;
|
border-radius: 0.4em;
|
||||||
}
|
}
|
||||||
|
@ -238,11 +239,31 @@ caption {
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
html {
|
html {
|
||||||
|
color: white;
|
||||||
|
background-color: black;
|
||||||
background-image: url("../images/bg-dark.jpg");
|
background-image: url("../images/bg-dark.jpg");
|
||||||
filter: invert(1);
|
|
||||||
}
|
}
|
||||||
img,video,canvas {
|
|
||||||
filter: invert(1);
|
body {
|
||||||
|
background-color: #444d;
|
||||||
|
}
|
||||||
|
|
||||||
|
header, pre, blockquote {
|
||||||
|
background-color: #134;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
color: #e98;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color:#9be;
|
||||||
|
}
|
||||||
|
a:visited {
|
||||||
|
color: #48b;
|
||||||
|
}
|
||||||
|
a:hover {
|
||||||
|
color: #f83;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue