From a0a22515226a28e199c351635ad0d8f139887efc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=90=D0=BD=D1=82=D0=BE=D0=BD=20=D0=A2=D1=80=D0=BE=D1=88?=
 =?UTF-8?q?=D0=B8=D0=BD?= <i@atroshin.ru>
Date: Sat, 17 Oct 2026 23:08:40 +0300
Subject: [PATCH] Scrollbars: one 12px style for every pane
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- the APDU list's 12px rule is folded into the global scrollbar style, so
  the side panel, APDU detail pane, dialogs (file-diff body), session
  lists/grid and the hex views' horizontal bars all use the same 12px bar
  with a 6px rounded thumb — no per-element overrides remain to drift,
  and the horizontal bars get an explicit height instead of the browser
  default
- Node test pins the global rule (12px width/height, 6px thumb radius) and
  the absence of per-element overrides; 527 Python + 55 Node tests
- SW cache simtrace-analyser-v75 (cosmetic, no version bump)
---
 frontend/index.html          | 11 ++++-------
 frontend/sw.js               |  2 +-
 frontend/tests/style.test.js | 21 +++++++++++----------
 3 files changed, 16 insertions(+), 18 deletions(-)

diff --git a/frontend/index.html b/frontend/index.html
index 80ec249..bf1460d 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -120,10 +120,6 @@ body { font: 14px/1.5 system-ui, sans-serif; background: var(--bg); color: var(-
 
 /* APDU list */
 .apdu-list { flex: 1 1 0; min-height: 0; overflow-y: auto; padding: 8px; }
-.apdu-list::-webkit-scrollbar,
-.side-panel::-webkit-scrollbar { width: 12px; }
-.apdu-list::-webkit-scrollbar-thumb,
-.side-panel::-webkit-scrollbar-thumb { border-radius: 6px; }
 .apdu-entry { display: flex; gap: 12px; padding: 3px 12px; border-bottom: 1px solid var(--bg-panel); cursor: pointer; align-items: baseline; }
 .apdu-entry.apdu-pair { background: var(--pair-row); }
 .apdu-entry:hover { background: var(--bg-panel); }
@@ -319,10 +315,11 @@ body { font: 14px/1.5 system-ui, sans-serif; background: var(--bg); color: var(-
 .comprion-error { font-size: 12px; line-height: 1.45; color: var(--error); margin-top: 8px; }
 .comprion-error:empty { display: none; }
 
-/* Scrollbar */
-::-webkit-scrollbar { width: 6px; }
+/* Scrollbar — one style for every pane (APDU list, side panel, APDU detail,
+   dialogs, session lists, the hex views' horizontal bars) */
+::-webkit-scrollbar { width: 12px; height: 12px; }
 ::-webkit-scrollbar-track { background: var(--scrollbar-track); }
-::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 3px; }
+::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 6px; }
 </style>
 </head>
 <body>
diff --git a/frontend/sw.js b/frontend/sw.js
index de1e8db..cfdc831 100644
--- a/frontend/sw.js
+++ b/frontend/sw.js
@@ -1,4 +1,4 @@
-const CACHE = 'simtrace-analyser-v74';
+const CACHE = 'simtrace-analyser-v75';
 
 const PRECACHE = [
     'index.html',
diff --git a/frontend/tests/style.test.js b/frontend/tests/style.test.js
index dee24df..3bf794e 100644
--- a/frontend/tests/style.test.js
+++ b/frontend/tests/style.test.js
@@ -1,6 +1,6 @@
-// Scrollbar styling: the APDU list and the side panel share one rule, so
-// their widths cannot drift apart (the side panel used to fall back to the
-// global 6px bar while the list uses 12px).
+// Scrollbar styling: every pane shares one global rule (12px bars, 6px
+// rounded thumb) — the APDU list used to be 12px while the side panel,
+// detail pane, dialogs and session lists fell back to a 6px default.
 
 const { test } = require('node:test');
 const assert = require('node:assert');
@@ -8,15 +8,16 @@ const { loadSrc } = require('./helpers.js');
 
 const src = loadSrc();
 
-test('the APDU list and the side panel share the 12px scrollbar rule', () => {
-	const rule = /\.apdu-list::-webkit-scrollbar,\s*\n\.side-panel::-webkit-scrollbar \{ width: 12px; \}/;
-	assert.match(src, rule);
-	// the thumb radius pairs with the width (6px = half of 12px)
+test('every pane uses the global 12px scrollbar rule', () => {
+	assert.match(src, /::-webkit-scrollbar \{ width: 12px; height: 12px; \}/);
 	assert.match(
 		src,
-		/\.apdu-list::-webkit-scrollbar-thumb,\s*\n\.side-panel::-webkit-scrollbar-thumb \{ border-radius: 6px; \}/);
+		/::-webkit-scrollbar-thumb \{ background: var\(--scrollbar-thumb\); border-radius: 6px; \}/);
+	assert.match(src, /::-webkit-scrollbar-track \{ background: var\(--scrollbar-track\); \}/);
 });
 
-test('the global scrollbar default stays thin for the other panes', () => {
-	assert.match(src, /::-webkit-scrollbar \{ width: 6px; \}/);
+test('no per-element scrollbar overrides or thin default remain', () => {
+	assert.doesNotMatch(src, /\.apdu-list::-webkit-scrollbar/);
+	assert.doesNotMatch(src, /\.side-panel::-webkit-scrollbar/);
+	assert.doesNotMatch(src, /::-webkit-scrollbar \{ width: 6px/);
 });