diff options
| author | Loek Le Blansch <loek@pipeframe.xyz> | 2025-01-25 11:24:52 +0100 |
|---|---|---|
| committer | Loek Le Blansch <loek@pipeframe.xyz> | 2025-01-25 11:24:52 +0100 |
| commit | 3f63afa14b364003aef9ca8dd83ce0bd37102ab3 (patch) | |
| tree | b3d77842360282df6019630f3795e033727d9c99 | |
| parent | 89516cc7bc16f0546f4fea99238d74f87fb84bc9 (diff) | |
fix dark mode
| -rw-r--r-- | _layouts/default.html | 3 | ||||
| -rw-r--r-- | _sass/media.scss | 18 |
2 files changed, 12 insertions, 9 deletions
diff --git a/_layouts/default.html b/_layouts/default.html index ef50700..9c2204f 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -3,7 +3,7 @@ <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> - <link rel="stylesheet" href="/style.css"> + <meta name="color-scheme" content="light dark"> <meta property='og:site_name' content='{{ page.date }}' /> <meta property='og:title' content='{{ page.title }}' /> <meta property='og:description' content='{{ page.subtitle }}' /> @@ -12,6 +12,7 @@ {% else %} <title>{{ site.title }}</title> {% endif %} + <link rel="stylesheet" href="/style.css"> </head> <body> <header class="invert plainlink"> diff --git a/_sass/media.scss b/_sass/media.scss index e7b4aee..a3fedea 100644 --- a/_sass/media.scss +++ b/_sass/media.scss @@ -11,23 +11,25 @@ } @media only screen and (prefers-color-scheme: dark) { - :root, html { - background-color: black; - color: white; - } .invert { background-color: #222; color: inherit; } nav .item.active { - color: inherit !important; - background-color: black !important; + color: inherit; + background-color: canvas; text-decoration: underline; font-weight: bold; } - a { color: #9aa9f9; } - a:visited { color: #bb87f2; } + + :root { + --code-comment: #808b9bd9; + --code-keyword: #d25a76; + --code-string: #e4a87e; + --code-number: #fa7d57; + --code-operator: #da9eff; + } } @media print { |