Automatic dark/light colorschemes (#234)

* Automatic dark/light colorschemes

A new `colorscheme` option is added with the capability to be always dark,
always light, or automatic based on the user's browser setting.  This
makes the `inverted` option superfluous, and therefore deprecated.
Nomenclature of files, variables, etc are changed from `inverted` to
`dark` to reflect this change.

Closes #226.

* Remove inverted option completely

The `inverted` option is now not just deprecated, but removed
completely.
This commit is contained in:
John Schroeder
2019-11-21 07:13:49 -06:00
committed by Luiz F. A. de Prá
parent f6caaf0493
commit b00b75064d
14 changed files with 167 additions and 116 deletions

View File

@@ -0,0 +1,49 @@
@mixin base_dark {
color: $fg-color-dark;
background-color: $bg-color-dark;
a {
color: $link-color-dark;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: $alt-fg-color-dark;
}
code {
background-color: $alt-bg-color-dark;
color: $fg-color-dark;
}
pre {
code {
background-color: inherit;
color: inherit;
}
}
blockquote {
border-left: 2px solid $alt-bg-color-dark;
}
table td, table th {
border: 2px solid $alt-fg-color-dark;
}
}
body.colorscheme-dark {
@include base_dark()
}
body.colorscheme-auto {
@media (prefers-color-scheme: dark) {
@include base_dark()
}
}