breakglass UI: foldable control sections for small screens
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful

Viktor: "make screens foldable so they can be viewed on small screens." The VM-control sheet packed Inspect + 4 power buttons + a long output dump into one scroll on a phone. Made the dense sections collapsible with native <details>/<summary> (zero-JS, accessible):
- Inspect and Power are foldable groups, open by default (nothing important hidden), tap the caret header to collapse the one you are not using.
- Command output (e.g. a long forensics dump) is a foldable block; its <pre> is capped at 46vh with internal scroll so it never runs off the page.

Verified via Playwright at 390x844: tapping Power collapses it to its header; the forensics output folds and scrolls within a bounded box. Works on desktop too (side panel stays expanded).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Viktor Barzin 2026-06-12 23:21:01 +00:00
parent aa054cac3f
commit 0e45445341
4 changed files with 60 additions and 18 deletions

View file

@ -6,8 +6,8 @@
<meta name="color-scheme" content="dark" />
<meta name="robots" content="noindex, nofollow" />
<title>devvm breakglass</title>
<script type="module" crossorigin src="./assets/index-DFUUDy82.js"></script>
<link rel="stylesheet" crossorigin href="./assets/index-B_5XZQm9.css">
<script type="module" crossorigin src="./assets/index-DjaW81Sq.js"></script>
<link rel="stylesheet" crossorigin href="./assets/index-DWHIP1Zw.css">
</head>
<body>
<div id="app"></div>