add clickables image headers, minor changes

This commit is contained in:
NightFox 2024-02-14 21:32:11 +03:00
parent e0c7229c89
commit 2bd2a9d2c4
4 changed files with 21 additions and 9 deletions

View File

@ -157,7 +157,9 @@ table, tr, td, th {
grid-gap: 2px;
align-items: stretch;
}
.sidebar h2 {
font-size: 17px;
}
#options {
height: var(--options-height);
}
@ -201,6 +203,7 @@ body.min { /* split feature */
}
@keyframes flash {
0% {
z-index: 1;
@ -283,23 +286,30 @@ body.min { /* split feature */
position: relative;
}
.meta-block h2 {
.meta-block h3 {
/*display: none;*/
font-family: monospace;
/*font-family: "Gill Sans", sans-serif;*/
padding-top: 10px;
margin-top: revert;
/*font-size: 150%;*/
font-size: 1.5em;
}
.meta-block h2:before {
.meta-block h3:before {
content: "🎯\FE0F"; /* for hedging her bets; see .emoji for details */
}
.text-link {
text-decoration: none;
}
#fail_images.padding .meta-block {
/*margin-block: 100vh;*/
padding-top: calc(var(--height-image));
padding-bottom: 2px;
/*padding-bottom: calc(50% - var(--height-image) );*/
}
#fail_images.padding .meta-block h2, .meta-block:first-child h2 {
#fail_images.padding .meta-block h3, .meta-block:first-child h3 {
border-top: none;
}

View File

@ -191,7 +191,9 @@ function buildTestResultImages(data) {
//return Tag('details', {id: makeId(d)}, null, [
return Tag('div', {id: makeId(d), "class": "meta-block"}, null, [
//Tag('summary', null, `${d.test}/${d.channel} δ=${d.diff_pct}`),
Tag('h2', null, `${d.test}/${d.channel} δ=${d.diff_pct}`),
Tag("a", {"class": "text-link", "href": `#${d.test}/${d.channel}`}, null, [
Tag('h3', null, `${d.test}/${d.channel} δ=${d.diff_pct}`)
]),
Tag('div', {"class": "image-container"}, null, [
Tag('div', {"class": "block block-gold"}, null, [Tag('img', {src: d.image_gold, loading: "lazy", "class": "gold"})]),
Tag('div', {"class": "block block-test"}, null, [Tag('img', {src: d.image_test, loading: "lazy", "class": "test"})]),

View File

@ -1,7 +1,7 @@
body {
background: black;
color: #EEE;
scrollbar-color: #67005c #222;
scrollbar-color: #67005c #222; /*#5e0080?*/
}
.panel {
@ -11,7 +11,7 @@ body {
color: cornflowerblue;
}
.meta-block h2 {
.meta-block h3 {
color: gold;
border-top: 3px gray solid;
}
@ -41,5 +41,5 @@ a, a:visited {
}
.content {
scrollbar-color: #e100ca #222;
scrollbar-color: gold #222; /* #e100ca */
}

View File

@ -10,7 +10,7 @@ body {
color: cornflowerblue;
}
.meta-block h2 {
.meta-block h3 {
color: goldenrod;
border-top: 3px lightgray solid;
}