jgamboa/miniSCP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Stop rows shifting 2px when selected

Browse Source 
7.css gives ONLY tr.highlighted a border (1px solid #aaddfa), and its table is
border-collapse: collapse — so a selected row genuinely grew 1px at top and
bottom and pushed every row beneath it down by 2px. Moving the cursor made the
whole list jitter.

Every tbody row now reserves that 1px as a transparent border, so selecting a
row changes colour and nothing about the geometry.

The rule has to live in `skinfix`, which outranks `skin` by LAYER regardless of
specificity — so a blanket transparent border there also blanks 7.css's own
highlight border. Both selected states therefore restate border-color
explicitly: the inactive pane via --w7-li-bd-hl (the same #aaddfa 7.css uses,
and already restated by the dark palette), the focused pane via --w7-el-bd-h.

Added a "selection geometry" pair to the harness — identical tables, one with a
middle row selected — so the baselines either line up or they visibly do not.
They did not before this change; they do now, verified zoomed.

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
jgamboa
2026-08-16 02:15:54 +02:00
co-authored by Claude
parent 66076cf1d7
commit 2db367318d
2 changed files with 45 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/styles.css
+15
View File
@@ -639,6 +639,21 @@ body {
border-color: var(--w7-li-bd-hl);
}
/* Constant row geometry. 7.css gives ONLY tr.highlighted a 1px border, and
the table is border-collapse: collapse — so a selected row physically grew
1px at top and bottom and shoved every row below it down by 2px as the
cursor moved. Every row reserves that border instead, transparent when not
selected, so selecting changes colour and nothing else.
NOTE: this sits in `skinfix`, which outranks `skin` by LAYER regardless of
specificity, so it would also blank 7.css's highlight border — both
selected states therefore restate their border-color below. */
.win7 table > tbody > tr {
border: 1px solid transparent;
}
.win7 table > tbody > tr.highlighted {
border-color: var(--w7-li-bd-hl);
}
/* Pane-focus model (commander convention, matching Win7 Explorer):
the CURSOR ROW always carries the selection band in BOTH panels —
tr.highlighted covers "selected via Space" AND "cursor row" (the template