fix(l4d2-web): file tree — uniform vertical spacing across all rows

The flex 'gap' shorthand on .file-tree-row was setting row-gap as well
as column-gap, so when the .file-tree-children div wrapped to a new
line the row-gap (--space-s) added on top of the nested ul's
margin-top (--space-xs) — making the button-to-first-child gap visibly
bigger than the sibling-row gap. Switch to 'gap: 0 var(--space-s)' so
only column-gap applies; vertical rhythm is now owned exclusively by
the outer grid gap (--space-xs) and the nested ul margin-top
(--space-xs), both equal.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
mwiegand 2026-05-08 20:49:05 +02:00
parent 4619a91f45
commit 7b31390b4c
No known key found for this signature in database

View file

@ -206,7 +206,10 @@ dialog.modal::backdrop {
.file-tree-row { .file-tree-row {
display: flex; display: flex;
gap: var(--space-s); /* Row-gap 0 so the wrapped .file-tree-children div sits directly under
the toggle button; vertical spacing is owned exclusively by the
outer grid's gap and the nested ul's margin-top. */
gap: 0 var(--space-s);
align-items: baseline; align-items: baseline;
flex-wrap: wrap; flex-wrap: wrap;
} }