viktor/claude-agent-service
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

breakglass UI: mobile-first rework (chat input was hidden on phones)
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
Details

Browse source 
Mobile is the primary client for fixing the devvm, but the first cut was
desktop-first and the chat input was unreachable on a phone:
- Root cause: the shell used height:100%/100vh, so on mobile browsers the
  composer at the bottom sat behind the address/tool bar — you saw the VM
  buttons but no place to type. Switched #app to 100dvh (dynamic viewport
  height) with a 100vh fallback; body no longer scrolls (chat scrolls
  internally), killing iOS rubber-banding.
- Layout is now mobile-first single-column: the chat fills the screen with
  the composer pinned at the bottom and always visible. The VM power controls
  moved into a slide-up bottom sheet behind a compact "⚡ VM" header button
  (backdrop + close + grab handle). At ≥900px the sheet becomes a static side
  column again and the toggle is hidden — desktop unchanged.
- Touch targets ≥40px; composer textarea bumped to 16px so iOS Safari doesn't
  auto-zoom on focus (which itself shoved the composer out of view).

Verified at 390×844 (iPhone) and 1280×800 via Playwright: input box renders at
y=723–821 (inside the 844 viewport), sheet slides in on tap, desktop keeps the
2-column side panel.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Viktor Barzin 2026-06-12 23:11:46 +00:00
parent 4f361d91eb
commit aa054cac3f
7 changed files with 194 additions and 95 deletions
Download patch file Download diff file Expand all files Collapse all files

1
app/breakglass/static/assets/index-B_5XZQm9.css Normal file
View file

File diff suppressed because one or more lines are too long

5
app/breakglass/static/assets/index-DNECe1Jo.js → app/breakglass/static/assets/index-DFUUDy82.js
View file

File diff suppressed because one or more lines are too long

1
app/breakglass/static/assets/index-DKeuidum.css
View file

File diff suppressed because one or more lines are too long

4
app/breakglass/static/index.html
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-DNECe1Jo.js"></script>
<link rel="stylesheet" crossorigin href="./assets/index-DKeuidum.css">
<script type="module" crossorigin src="./assets/index-DFUUDy82.js"></script>
<link rel="stylesheet" crossorigin href="./assets/index-B_5XZQm9.css">
</head>
<body>
<div id="app"></div>