Skip to content

fix: lock serial panel height with JS after layout#64

Merged
zevorn merged 1 commit intomainfrom
fix/serial-panel-js-lock
Mar 17, 2026
Merged

fix: lock serial panel height with JS after layout#64
zevorn merged 1 commit intomainfrom
fix/serial-panel-js-lock

Conversation

@zevorn
Copy link
Copy Markdown
Owner

@zevorn zevorn commented Mar 17, 2026

CSS-only approaches (min-height: 0, height: 0; flex: 1) don't reliably prevent grid row growth from serial content in all browsers.

Fix: on window.load, read serial-panel.offsetHeight (computed from grid stretch = flash-panel height) and set it as inline style.height. This gives an absolute constraint for overflow-y: auto to work against. Expand/collapse clears and re-locks.

CSS min-height:0 alone is not sufficient to prevent grid row growth
from serial output content in all browsers.

Fix: after page load, read the computed height of serial-panel
(which equals flash-panel via grid stretch) and set it as an
explicit inline style.  This creates an absolute height constraint
that overflow-y:auto on serial-output can work against.

The expand/collapse toggle clears and re-locks the height.

Signed-off-by: Chao Liu <chao.liu.zevorn@gmail.com>
@zevorn zevorn merged commit 6072c09 into main Mar 17, 2026
1 check passed
@zevorn zevorn deleted the fix/serial-panel-js-lock branch March 19, 2026 01:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant