Anri/mylloon.fr
1
0
Fork 0
Code Issues 14 Pull requests 2 Releases Packages 1 Activity Actions

use light-dark function

Browse source
This commit is contained in:
Mylloon 2024-12-15 19:59:53 +01:00
parent 423997bc13
commit 933c1cb7d7
Signed by: Anri
GPG key ID: A82D63DFF8D1317F
1 changed files with 4 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
static/css/markdown.css
View file

@ -1,22 +1,12 @@
@media (prefers-color-scheme: light) { @media (prefers-color-scheme: light) {
:root { :root {
--code-font-color: #333333;
--code-bg-color: #eeeeee;
--quote-border-color: #9852fa;
--quote-bg-color: #d8d6d6;
--separator-color: #cccccc; --separator-color: #cccccc;
--tag-bg-color: #d2e0f0;
} }
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:root { :root {
--code-font-color: #eeeeee;
--code-bg-color: #333333;
--quote-border-color: #bd93f9;
--quote-bg-color: #273341;
--separator-color: #414558; --separator-color: #414558;
--tag-bg-color: #242e38;
} }
} }
@ -64,8 +54,8 @@ blockquote {
margin: 1em 0; margin: 1em 0;
padding: 0.1em 10px; padding: 0.1em 10px;
border-left: 6px solid; border-left: 6px solid;
border-color: var(--quote-border-color); border-color: light-dark(#9852fa, #bd93f9);
background: var(--quote-bg-color); background: light-dark(#d8d6d6, #273341);
border-top-right-radius: 5px; border-top-right-radius: 5px;
border-bottom-right-radius: 5px; border-bottom-right-radius: 5px;
} }
@ -73,9 +63,9 @@ blockquote {
/* Little snippet of code (not blocks) */ /* Little snippet of code (not blocks) */
kbd, kbd,
code:not(.hljs):not(:has(svg)) { code:not(.hljs):not(:has(svg)) {
background: var(--code-bg-color); background: light-dark(#eeeeee, #333333);
border-radius: 3px; border-radius: 3px;
color: var(--code-font-color); color: light-dark(#333333, #eeeeee);
box-shadow: 0 1px 1px black; box-shadow: 0 1px 1px black;
font-size: calc(var(--font-size) * 0.8); font-size: calc(var(--font-size) * 0.8);
padding: 2px 4px; padding: 2px 4px;