Tentatively add a dark mode
This commit is contained in:
@@ -1,9 +1,20 @@
|
||||
@import "variables.scss";
|
||||
|
||||
$code-color-lineno: grey;
|
||||
$code-color-keyword: black;
|
||||
$code-color-type: black;
|
||||
$code-color-comment: grey;
|
||||
|
||||
:root {
|
||||
--code-color-keyword: black;
|
||||
--code-color-type: black;
|
||||
--code-color-comment: grey;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--code-color-keyword: #{darken(white, 40%)};
|
||||
--code-color-type: #{darken(white, 40%)};
|
||||
--code-color-comment: grey;
|
||||
}
|
||||
}
|
||||
|
||||
.highlight-label {
|
||||
padding: 0.25rem 0.5rem 0.25rem 0.5rem;
|
||||
@@ -21,7 +32,7 @@ $code-color-comment: grey;
|
||||
|
||||
code {
|
||||
font-family: $font-code;
|
||||
background-color: $code-color;
|
||||
background-color: var(--code-color);
|
||||
border: $code-border;
|
||||
padding: 0 0.25rem 0 0.25rem;
|
||||
}
|
||||
@@ -37,7 +48,7 @@ pre code {
|
||||
.lntable {
|
||||
border-spacing: 0;
|
||||
padding: 0.5rem 0 0.5rem 0;
|
||||
background-color: $code-color;
|
||||
background-color: var(--code-color);
|
||||
border-radius: 0;
|
||||
border: $code-border;
|
||||
display: block;
|
||||
@@ -84,14 +95,14 @@ pre code {
|
||||
|
||||
.kr, .k {
|
||||
font-weight: bold;
|
||||
color: $code-color-keyword;
|
||||
color: var(--code-color-keyword);
|
||||
}
|
||||
|
||||
.kt {
|
||||
font-weight: bold;
|
||||
color: $code-color-type;
|
||||
color: var(--code-color-type);
|
||||
}
|
||||
|
||||
.c, .c1 {
|
||||
color: $code-color-comment;
|
||||
color: var(--code-color-comment);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user