One border weight, and no sliver beside the nav

The nav's right edge read as two lines because it was two things: its own
border, and a sliver of the stage's background showing through a
sub-pixel gap before the app's webview began. The stage rect is now
rounded to whole pixels and to the same edges each time, so the app
covers the stage exactly.

Borders are one weight throughout and the lightest that still separates -
slate-200 in light, slate-800 in dark. Nothing drawn heavier than it
needs to be to read as an edge.
This commit is contained in:
2026-09-01 15:32:21 +02:00
parent 0567a4b7c7
commit 07bb22eb2d
4 changed files with 25 additions and 9 deletions
+7 -1
View File
@@ -56,7 +56,13 @@ export default function App() {
const el = stageRef.current;
if (!el) return;
const r = el.getBoundingClientRect();
void api.setStage(r.x, r.y, r.width, r.height, 0);
/* Rounded to whole pixels, and to the same edges each time. A fractional
left edge leaves a sliver of the stage's own background showing between
the nav's border and the app — which reads as a second, lighter border
line running down the whole window. */
const x = Math.round(r.x);
const y = Math.round(r.y);
void api.setStage(x, y, Math.round(r.right) - x, Math.round(r.bottom) - y, 0);
}, []);
useLayoutEffect(() => {