Side panel: scrollbar matches the APDU list's width
- the side panel had no scrollbar rule of its own, so it fell back to the global 6px default while the APDU list uses 12px; the two now share one rule (width 12px, thumb radius 6px = half the bar), so they cannot drift apart again — the other panes keep the thin global bar - Node test pins the shared rule (and the 6px global default) - SW cache simtrace-analyser-v74 (cosmetic, no version bump)
This commit is contained in:
1 parent
08a6446bc8
commit
424cb4e238
3 files changed
+27
-3
No files matched your search
+4
-2
@@ -120,8 +120,10 @@ body { font: 14px/1.5 system-ui, sans-serif; background: var(--bg); color: var(-
|
|||||||
|
|
||||||
/* APDU list */
|
/* APDU list */
|
||||||
.apdu-list { flex: 1 1 0; min-height: 0; overflow-y: auto; padding: 8px; }
|
.apdu-list { flex: 1 1 0; min-height: 0; overflow-y: auto; padding: 8px; }
|
||||||
.apdu-list::-webkit-scrollbar { width: 12px; }
|
.apdu-list::-webkit-scrollbar,
|
||||||
.apdu-list::-webkit-scrollbar-thumb { border-radius: 6px; }
|
.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 { 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.apdu-pair { background: var(--pair-row); }
|
||||||
.apdu-entry:hover { background: var(--bg-panel); }
|
.apdu-entry:hover { background: var(--bg-panel); }
|
||||||
|
|||||||
+1
-1
@@ -1,4 +1,4 @@
|
|||||||
const CACHE = 'simtrace-analyser-v73';
|
const CACHE = 'simtrace-analyser-v74';
|
||||||
|
|
||||||
const PRECACHE = [
|
const PRECACHE = [
|
||||||
'index.html',
|
'index.html',
|
||||||
|
|||||||
@@ -0,0 +1,22 @@
|
|||||||
|
// 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).
|
||||||
|
|
||||||
|
const { test } = require('node:test');
|
||||||
|
const assert = require('node:assert');
|
||||||
|
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)
|
||||||
|
assert.match(
|
||||||
|
src,
|
||||||
|
/\.apdu-list::-webkit-scrollbar-thumb,\s*\n\.side-panel::-webkit-scrollbar-thumb \{ border-radius: 6px; \}/);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('the global scrollbar default stays thin for the other panes', () => {
|
||||||
|
assert.match(src, /::-webkit-scrollbar \{ width: 6px; \}/);
|
||||||
|
});
|
||||||
Reference in new issue
Block a user