Switch to media logic for themes and misc fixes

This commit is contained in:
Jonas Tobias Hopusch 2021-07-19 00:06:57 +02:00
parent 6a63b32199
commit b57b53554e
Failed to generate hash of commit
1 changed files with 38 additions and 13 deletions

View File

@ -11,29 +11,54 @@ header, footer {
.globalnav{ .globalnav{
display: flex; display: flex;
flex-direction: row; flex-direction: row;
border-collapse: collapse; border: none;
} }
.globalnav-element { .globalnav-element {
display: inline-block; display: inline-block;
border-width: 1px;
border-style: solid;
flex-grow: 1; flex-grow: 1;
padding: 0.5em 0;
margin: 0 1px;
} }
body.dark-theme a { code {
color: lightskyblue; display: inline-block;
background-color: lightgray;
color: green;
padding: 0 0.5em;
} }
body.dark-theme .globalnav-element { @media (prefers-color-scheme: dark) {
border-color: black; html {
background-color: black;
color: white;
}
.globalnav-element {
background-color: #222;
}
code {
background-color: #444;
color: lawngreen;
}
a {
color: lightskyblue;
}
} }
body.light-theme .globalnav-element { @media (prefers-color-scheme: light) {
border-color: white; html {
} background-color: white;
color: black;
}
pre, code { .globalnav-element {
background-blend-mode: darken; background-color: #ddd;
color: lightgreen; }
code {
color: green;
}
} }