cronekorkn/left4me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(server-detail): scope console tab-pane flex to :not([hidden])

Browse source 
The .tab-pane[data-tab="console"] flex rule added in eabb976 had equal
specificity to .tab-pane[hidden] { display: none } and came later in
the cascade, so the hidden console pane rendered display:flex right
underneath the active log pane — the page showed both at once,
doubling the inspection strip's height. Adding :not([hidden]) keeps
the hidden rule winning when the tab is inactive.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
mwiegand 2026-05-17 21:50:01 +02:00
parent eabb9764b9
commit 36e4b61581
No known key found for this signature in database
1 changed files with 5 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
l4d2web/l4d2web/static/css/components.css
View file

@ -1043,8 +1043,11 @@ div.modal.modal-wide {
.tab-pane[hidden] { display: none; } .tab-pane[hidden] { display: none; }
.tab-pane .log-stream { max-height: none; } /* let pane handle scrolling */ .tab-pane .log-stream { max-height: none; } /* let pane handle scrolling */
/* Console tab pane — input pinned at bottom, transcript scrolls. */ /* Console tab pane — input pinned at bottom, transcript scrolls.
.tab-pane[data-tab="console"] { :not([hidden]) keeps .tab-pane[hidden] { display: none } winning
when the tab is inactive (otherwise these rules would tie on
specificity and the later rule would defeat the hidden state). */
.tab-pane[data-tab="console"]:not([hidden]) {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/* inherits max-height: 12rem from .tab-pane */ /* inherits max-height: 12rem from .tab-pane */