From 6d7f3f3aed9d03aaba5edd7bdceeb24c5b47f97c Mon Sep 17 00:00:00 2001 From: bowenliang123 Date: Thu, 10 Sep 2026 10:29:17 +0800 Subject: [PATCH] fix(css): adjust gradient white divider scaling for DNA mode bands --- src/client/styles/browser.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/client/styles/browser.css b/src/client/styles/browser.css index 73b947f..1be3c7a 100644 --- a/src/client/styles/browser.css +++ b/src/client/styles/browser.css @@ -3,10 +3,10 @@ (a bare .lc-gran would add a second auto margin and split the free space). */ .lc-br-dna-ctl { margin-left: 0; flex: none; } /* DNA mode: per-item bands read as one gel strip — a card-colored divider keeps adjacent same-category bands - distinguishable. The divider scales with the band (`min(1px, 25%)` of its own width): long sessions pin hundreds - of bands at ≤1px, where a fixed 1px divider would cover the whole band and blank the strip. A gradient layer over + distinguishable. The divider scales with the band (`min(0.5px, 12.5%)` of its own width): long sessions pin hundreds + of bands at ≤1px, where a fixed divider would cover the whole band and blank the strip. A gradient layer over the segment's inline `backgroundColor` — a fixed inset box-shadow cannot scale. */ -.lc-br-bar-dna .lc-stacked-seg { background-image: linear-gradient(to right, transparent calc(100% - min(1px, 25%)), var(--dsw-alias-bg-layer-1) 0); } +.lc-br-bar-dna .lc-stacked-seg { background-image: linear-gradient(to right, transparent calc(100% - min(0.5px, 12.5%)), var(--dsw-alias-bg-layer-1) 0); } .lc-br-hint { margin-left: auto; color: var(--dsw-alias-label-secondary); font-size: 11px; font-weight: 400; white-space: nowrap; } .lc-br-pick { font: inherit; font-size: 12px; color: var(--dsw-alias-label-primary); background: var(--dsw-alias-bg-layer-2); border: 1px solid var(--dsw-alias-border-l2); border-radius: 6px; padding: 3px 6px; max-width: 240px; } .lc-br-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 8px; color: var(--dsw-alias-label-secondary); }