tastytea
/
blog
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

css: make vbariables for alternative colour variants

This commit is contained in:
tastytea 2023-10-14 18:58:07 +02:00
parent 625360c4e3
commit 6065f05950
Signed by: tastytea
SSH Key Fingerprint: SHA256:FBkvrOlhq5use1XEttyUGT4bUTDVA1ar9SgIc9P03cM
1 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
assets/blog.css
View File

@ -38,6 +38,12 @@
} }
} }
:root {
--bg-alt: color-mix(in srgb, var(--bg) 70%, var(--semitrans));
--fg-alt: color-mix(in srgb, var(--fg) 70%, var(--semitrans));
--link-alt: color-mix(in srgb, var(--link) 50%, var(--fg));
}
html { html {
background-color: var(--bg); background-color: var(--bg);
color: var(--fg); color: var(--fg);
@ -82,7 +88,7 @@ a {
} }
a:visited { a:visited {
color: color-mix(in srgb, var(--link) 50%, var(--fg)); color: var(--link-alt);
} }
a:hover, a:hover:visited { a:hover, a:hover:visited {
@ -176,7 +182,7 @@ div.admonitionblock td.icon {
} }
div.admonitionblock table { div.admonitionblock table {
background-color: color-mix(in srgb, var(--bg) 70%, var(--semitrans)); background-color: var(--bg-alt);
} }
div.note td.icon { div.note td.icon {
@ -233,14 +239,14 @@ kbd {
padding: 0.05em; padding: 0.05em;
background-color: var(--fg); background-color: var(--fg);
color: var(--bg); color: var(--bg);
border: 0.15em inset color-mix(in srgb, var(--fg) 50%, var(--semitrans)); border: 0.15em inset var(--fg-alt);
border-radius: 0.2em; border-radius: 0.2em;
} }
.button { .button {
display: inline-block; display: inline-block;
padding: 0 0.1em; padding: 0 0.1em;
border: 0.15em outset color-mix(in srgb, var(--bg) 50%, var(--semitrans)); border: 0.15em outset var(--bg-alt);
border-radius: 0.2em; border-radius: 0.2em;
} }
@ -271,7 +277,7 @@ kbd {
.pagination { .pagination {
margin-top: 0.5em; margin-top: 0.5em;
font-family: sans-serif; font-family: sans-serif;
background-color: color-mix(in srgb, var(--bg) 70%, var(--semitrans)); background-color: var(--bg-alt);
padding-left: 0.2em; padding-left: 0.2em;
border-top: 0.1em dotted var(--accent); border-top: 0.1em dotted var(--accent);
} }