mirror of
https://blitiri.com.ar/repos/chasquid
synced 2025-12-18 14:47:03 +00:00
coverhtml: Add dark mode support
This patch adds a dark mode support to coverhtml's output.
This commit is contained in:
@@ -173,12 +173,49 @@ const htmlTmpl = `<!DOCTYPE html>
|
|||||||
<title>{{.Title}}</title>
|
<title>{{.Title}}</title>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
:root {
|
||||||
|
--txt: #333;
|
||||||
|
--bg: white;
|
||||||
|
--a: #1c3986;
|
||||||
|
--a-hover: #069;
|
||||||
|
--odd-bg: #f5f5f7;
|
||||||
|
--pre-bg: #f8f8f8;
|
||||||
|
--pre-border: #e5e5e5;
|
||||||
|
|
||||||
|
// color palette from graphiq.
|
||||||
|
--cov0: red;
|
||||||
|
--cov1: #0b7bab;
|
||||||
|
--cov2: #09639b;
|
||||||
|
--cov3: #034a8b;
|
||||||
|
--cov4: #00337c;
|
||||||
|
--cov5: #032663;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
:root {
|
||||||
|
--txt: rgba(255, 255, 255, 0.90);
|
||||||
|
--bg: #121212;
|
||||||
|
--a: #44b4ec;
|
||||||
|
--a-hover: #7fc9ee;
|
||||||
|
--odd-bg: #222222;
|
||||||
|
--pre-bg: #111;
|
||||||
|
--pre-border: #333;
|
||||||
|
--cov0: #f2a359;
|
||||||
|
--cov1: #2b84b1;
|
||||||
|
--cov2: #3393c4;
|
||||||
|
--cov3: #3ca3d7;
|
||||||
|
--cov4: #44b3eb;
|
||||||
|
--cov5: #4dc3ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font: 100%/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
|
font: 100%/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
|
||||||
Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans",
|
Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans",
|
||||||
"Helvetica Neue", Arial, sans-serif, "Apple Color Emoji",
|
"Helvetica Neue", Arial, sans-serif, "Apple Color Emoji",
|
||||||
"Segoe UI Emoji", "Segoe UI Symbol";
|
"Segoe UI Emoji", "Segoe UI Symbol";
|
||||||
color: #333;
|
color: var(--txt);
|
||||||
|
background: var(--bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
@@ -186,13 +223,13 @@ const htmlTmpl = `<!DOCTYPE html>
|
|||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #1c3986;
|
color: var(--a);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover {
|
a:hover {
|
||||||
color: #069;
|
color: var(--a-hover);
|
||||||
}
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
@@ -200,7 +237,7 @@ const htmlTmpl = `<!DOCTYPE html>
|
|||||||
}
|
}
|
||||||
|
|
||||||
tr:nth-child(odd) {
|
tr:nth-child(odd) {
|
||||||
background: #f5f5f7;
|
background: var(--odd-bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
tr.total {
|
tr.total {
|
||||||
@@ -220,24 +257,23 @@ const htmlTmpl = `<!DOCTYPE html>
|
|||||||
font-family: Monaco, Bitstream Vera Sans Mono, Lucida Console,
|
font-family: Monaco, Bitstream Vera Sans Mono, Lucida Console,
|
||||||
Terminal, Consolas, Liberation Mono, DejaVu Sans Mono,
|
Terminal, Consolas, Liberation Mono, DejaVu Sans Mono,
|
||||||
Courier New, monospace;
|
Courier New, monospace;
|
||||||
color:#333;
|
color: var(--txt);
|
||||||
}
|
}
|
||||||
|
|
||||||
pre {
|
pre {
|
||||||
padding: 0.5em 0.8em;
|
padding: 0.5em 0.8em;
|
||||||
background: #f8f8f8;
|
background: var(--pre-bg);
|
||||||
border-radius: 1em;
|
border-radius: 1em;
|
||||||
border:1px solid #e5e5e5;
|
border:1px solid var(--pre-border);
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Color palette from graphiq.
|
.cov0 { color: var(--cov0); }
|
||||||
.cov0 { color: red; }
|
.cov1 { color: var(--cov1); }
|
||||||
.cov1 { color: #0B7BAB; }
|
.cov2 { color: var(--cov2); }
|
||||||
.cov2 { color: #09639B; }
|
.cov3 { color: var(--cov3); }
|
||||||
.cov3 { color: #034A8B; }
|
.cov4 { color: var(--cov4); }
|
||||||
.cov4 { color: #00337C; }
|
.cov5 { color: var(--cov5); }
|
||||||
.cov5 { color: #032663; }
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
Reference in New Issue
Block a user