APDU list + detail: hover and the detail header follow the theme tints
- the detail header used --bg-input in dark mode (plus a light-only #dbeafe override), so it only matched the list selection in the light theme; it now uses var(--selected-bg) — the same variable as the selected row — so the two are in sync in both themes (light unchanged) - .apdu-entry:hover used --bg-panel (a grey in the same family as the GET RESPONSE pair rows); both themes now set --hover-bg — the accent at 16% (dark) / 10% (light), a translucent tint that stacks with whatever the row's background is — and a single hover rule uses it: hovering tints the row blue, lighter than the selection and a different hue from the pair rows. The rules stay ordered .apdu-pair → :hover → .selected, so hovering the selected row keeps its selection colour - Node tests pin the hover variable per theme, the hover rule (and that the old grey rule is gone) and the detail header's variable; 540 Python + 80 Node tests - SW cache simtrace-analyser-v91 (cosmetic, no version bump)
This commit is contained in:
1 parent
119b1cd54a
commit
4a03f83459
3 files changed
+18
-4
No files matched your search
@@ -37,6 +37,19 @@ test('the APDU selection is a blue tint in both themes', () => {
|
||||
assert.doesNotMatch(src, /--selected-bg: var\(--bg-input\)/);
|
||||
});
|
||||
|
||||
test('the APDU hover is a slight blue tint in both themes', () => {
|
||||
assert.match(src, /\.apdu-entry:hover \{ background: var\(--hover-bg\); \}/);
|
||||
assert.match(src, /--hover-bg: rgba\(59, 130, 246, 0\.16\);/); // dark
|
||||
assert.match(src, /--hover-bg: rgba\(59, 130, 246, 0\.10\);/); // light
|
||||
// The hover must not fall back to the pair rows' grey or the selection.
|
||||
assert.doesNotMatch(src, /\.apdu-entry:hover \{ background: var\(--bg-panel\); \}/);
|
||||
});
|
||||
|
||||
test('the detail header follows the list selection in both themes', () => {
|
||||
assert.match(src, /\.detail-header \{[^}]*background: var\(--selected-bg\);/);
|
||||
assert.doesNotMatch(src, /\[data-theme="light"\] \.detail-header/);
|
||||
});
|
||||
|
||||
// ── trace topbar layout ────────────────────────────────────────────────
|
||||
|
||||
test('the view selector sits over the side panel at the panel width', () => {
|
||||
|
||||
Reference in new issue
Block a user