From d5e67360fe90155fcd25d3fb712cb4ddaf322ad0 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?= Date: Fri, 23 Oct 2026 17:06:50 +0300 Subject: [PATCH] file manager: an enabled inactive read pill is outlined, not grey The Read decoded pill used the same grey fill as a disabled control, so an enabled pill looked unavailable (reported live). The inactive-but- enabled state is now an outlined button (blue on white/slate) and the grey fill plus dimming are reserved for the actually disabled state. The active pill keeps a border of the same width so the row does not shift. Pinned in fs_edit.test.js. 1022 Python + 1058 frontend; simple-v469. --- CHANGELOG.md | 3 +++ frontend/index.html | 17 +++++++++++------ frontend/sw.js | 2 +- frontend/tests/fs_edit.test.js | 10 ++++++++++ 4 files changed, 25 insertions(+), 7 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1e08ee3..03802a7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -30,6 +30,9 @@ every change carries a descriptive commit message. reserved — a record with a mixed indicator (e.g. `E9`) showed DCS and hid VP. - The read-only EF.SMSP view decoded the TP-DA length as octets, although it is the digit count (TS 23.040 §9.1.2.5); a slot padded with `00` gained phantom digits. +- The **Read decoded** pill no longer looks disabled when it is enabled: an inactive-but- + enabled pill is now an outlined button (blue on white/slate), and the grey fill and + dimming are left to the actually disabled state. ## [3.34.0] — 2026-10-23 diff --git a/frontend/index.html b/frontend/index.html index b295d73..aaf9adf 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -1129,8 +1129,8 @@
- - + +
@@ -16405,10 +16405,15 @@ function pysimFsSetMode(mode, skipRead) { const active = el.dataset.mode === mode; el.classList.toggle('bg-blue-600', active); el.classList.toggle('text-white', active); - el.classList.toggle('bg-gray-200', !active); - el.classList.toggle('dark:bg-slate-700', !active); - el.classList.toggle('text-gray-700', !active); - el.classList.toggle('dark:text-slate-300', !active); + // An enabled inactive pill is an outlined button, not a grey one: + // grey reads as "disabled" while the pill is still clickable. The + // grey/dimmed look is left to the disabled state alone. + el.classList.toggle('bg-white', !active); + el.classList.toggle('dark:bg-slate-800', !active); + el.classList.toggle('text-blue-600', !active); + el.classList.toggle('dark:text-blue-300', !active); + el.classList.toggle('hover:bg-gray-100', !active); + el.classList.toggle('dark:hover:bg-slate-600', !active); }); if (!skipRead && pysimFsSelected) pysimFsRead(); } diff --git a/frontend/sw.js b/frontend/sw.js index 5080986..78cfc31 100644 --- a/frontend/sw.js +++ b/frontend/sw.js @@ -1,4 +1,4 @@ -const CACHE = 'simple-v468'; +const CACHE = 'simple-v469'; const URLS = [ 'index.html', 'help.html', diff --git a/frontend/tests/fs_edit.test.js b/frontend/tests/fs_edit.test.js index 5f9c349..c6068df 100644 --- a/frontend/tests/fs_edit.test.js +++ b/frontend/tests/fs_edit.test.js @@ -117,12 +117,19 @@ test('Read raw / Read decoded pills switch the view and read the file', () => { assert.strictEqual(h.reads(), 0, 'skipRead updates the pills only'); assert.ok(h.pill('raw').classList.contains('bg-blue-600')); assert.ok(!h.pill('dec').classList.contains('bg-blue-600')); + // an enabled inactive pill is outlined, not grey: the grey fill reads as + // "disabled" although the pill is clickable (reported live) + assert.ok(h.pill('dec').classList.contains('bg-white')); + assert.ok(h.pill('dec').classList.contains('text-blue-600')); + assert.ok(!h.pill('dec').classList.contains('bg-gray-200')); pysimFsSetMode('dec'); assert.strictEqual(pysimFsDecodedMode, true); assert.strictEqual(h.reads(), 1, 'a pill click reads the selected file'); assert.ok(h.pill('dec').classList.contains('bg-blue-600')); assert.ok(!h.pill('raw').classList.contains('bg-blue-600')); + assert.ok(h.pill('raw').classList.contains('bg-white')); + assert.ok(!h.pill('raw').classList.contains('bg-gray-200')); }); test('pill clicks are ignored while editing', () => { @@ -221,4 +228,7 @@ test('the file manager row exposes the read pills and Edit raw', () => { assert.ok(html.includes('id="pysim-fs-read-raw-btn"') && html.includes('data-needs="card"')); const dec = /]*id="pysim-fs-read-dec-btn"[^>]*>/.exec(html); assert.ok(dec && dec[0].includes('data-needs-decoder'), 'the decoded pill is decoder-gated'); + // the enabled-inactive look is an outline; the grey fill is for disabled + assert.ok(dec[0].includes('bg-white') && dec[0].includes('text-blue-600')); + assert.ok(!dec[0].includes('bg-gray-200')); });