Browse Source

Add prefers-color-scheme support

master
Jens Pitkänen 5 months ago
parent
commit
aa3eaba900
2 changed files with 34 additions and 0 deletions
  1. 17
    0
      public/basic.css
  2. 17
    0
      static/basic.css

+ 17
- 0
public/basic.css View File

@@ -20,6 +20,23 @@ html {
@media (min-width: 42em) { body { width: 40em; } }
@media (min-width: 74ch) { body { width: 70ch; } }

@media (prefers-color-scheme: dark) {
body { background: #333; color: #CCC; }
h1, h2, h3, h4, h5, h6 { color: #EEE; }
a { color: #BFCFFF; }
a:visited { color: #E2BEFF; }
a:hover { color: #D3BFFF; }
a:active { color: #FFBFD8; }
}
@media (prefers-color-scheme: light) {
body { background: #FFF; color: #444; }
h1, h2, h3, h4, h5, h6 { color: #333; }
a { color: #0037EB; }
a:visited { color: #7600D6; }
a:hover { color: #4C00EB; }
a:active { color: #EB005E; }
}

body {
margin: auto;
padding: 2em;

+ 17
- 0
static/basic.css View File

@@ -20,6 +20,23 @@ html {
@media (min-width: 42em) { body { width: 40em; } }
@media (min-width: 74ch) { body { width: 70ch; } }

@media (prefers-color-scheme: dark) {
body { background: #333; color: #CCC; }
h1, h2, h3, h4, h5, h6 { color: #EEE; }
a { color: #BFCFFF; }
a:visited { color: #E2BEFF; }
a:hover { color: #D3BFFF; }
a:active { color: #FFBFD8; }
}
@media (prefers-color-scheme: light) {
body { background: #FFF; color: #444; }
h1, h2, h3, h4, h5, h6 { color: #333; }
a { color: #0037EB; }
a:visited { color: #7600D6; }
a:hover { color: #4C00EB; }
a:active { color: #EB005E; }
}

body {
margin: auto;
padding: 2em;

Loading…
Cancel
Save