From 20d02c28e4426e8500ee44b63a3c513ffa568446 Mon Sep 17 00:00:00 2001 From: NightFox Date: Wed, 18 Dec 2024 01:03:24 +0300 Subject: [PATCH] add focus for the selected comparison in the list; fix light theme --- render/index.js | 5 ++++- render/theme-dark.css | 5 +++-- render/theme-light.css | 13 ++++++++++--- 3 files changed, 17 insertions(+), 6 deletions(-) diff --git a/render/index.js b/render/index.js index 36bfb68..b58a2cc 100644 --- a/render/index.js +++ b/render/index.js @@ -245,7 +245,10 @@ function buildData(table, images, data, sort, filter, exact_match) { }; for (let tr of document.querySelectorAll("table tr")) { - tr.addEventListener("click", function() { + tr.addEventListener("click", function(event) { + this.parentElement.querySelector("tr.active")?.classList.toggle("active"); + event.stopPropagation(); + this.classList.toggle("active"); this.querySelector("a").click(); }); } diff --git a/render/theme-dark.css b/render/theme-dark.css index 7201010..dcadf4f 100644 --- a/render/theme-dark.css +++ b/render/theme-dark.css @@ -21,10 +21,11 @@ table { border: #e100ca 1px solid; border-radius: 6px; } -table tr:hover { - background: oklch(76.47% 0.279 334.17); +table tr:hover, +table tr.active { background: #512649; } + th { /*background: oklch(62.5% 0.291 308.12);*/ background: linear-gradient(0deg,#b540ff,cornflowerblue); diff --git a/render/theme-light.css b/render/theme-light.css index 67f44cc..4c37180 100644 --- a/render/theme-light.css +++ b/render/theme-light.css @@ -16,18 +16,25 @@ body { } table { - color: #eb4300; + color: #6e1f00; border: #ffa6f6 1px solid; border-radius: 6px; } +table tr:hover, +table tr.active { + background: #ffc3c3; +} th { background: oklch(62.5% 0.291 308.12); background: linear-gradient(0deg,#d99dff,#c4d7f9); /* box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.5);*/ } + + + a, a:visited { - color: #e100ca; - color: oklch(62.5% 0.291 334.06); + color: #9c008b; + color: oklch(0.47 0.22 334.15); } :root {