Houmeres/LLeMbas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 23 Wiki Activity

New markup over an old stylesheet

Browse Source 
Reported from a desktop browser: a stray close button beside the logo, badly
drawn, and a page that would not scroll. None of it was in the code that was
running -- it was the code the browser had not fetched.

The worker caches /static/ under a cache named for the release while the files
in it carried no version, and a page is fetched network-first. That only ever
worked because the worker used to seize every open tab the instant it installed
and wipe the old cache. 1.1.0 stopped it doing that, rightly -- it was swapping
stylesheets out from under a streaming reply -- and a momentary mismatch became
a permanent one: new markup over the previous release's CSS for as long as the
old worker lived. `.sidebar__close` had no rule there, so `.btn--icon` made it
inline-flex: visible everywhere, placed by nothing.

Every /static/ URL carries the release now, written by `templating.asset` and
precached by `sw.js:versioned` -- both halves, because caches.match compares the
query too and precaching the bare path would cache entries nothing requests.
Self-correcting: updating is enough.

The header was also a brand with a button appended and margin-left:auto doing
the placing, which holds exactly while that button is last. Two slots now: a
brand that shrinks and truncates, and a rail on the trailing edge.

Verified before changing anything: with the current stylesheet the button is
display:none at 1280 and, with thirty chats and forty messages, both scrollers
scroll. The first measurement said the thread did not -- that was
scroll-behavior: smooth reporting where it started.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Homer
2026-09-25 18:16:24 +00:00
co-authored by Claude Opus 5
parent 28390095a9
commit 201281d616
18 changed files with 216 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lembas/web/static/css/app.css
+27 -1
View File
@@ -446,13 +446,40 @@ button, input, textarea, select {
}
.sidebar[hidden] { display: none; }
/*
Two slots with a gap between them, and neither is positioned against the
other. The brand shrinks and truncates because its width is an instance
setting nobody here chose; the rail does not, because it is a whole number of
`--control-h` boxes and is the thing a hand is going for.
`gap` rather than `margin-left: auto` on the last child: auto-margin puts the
rail on the trailing edge only for as long as it happens to be last, and the
moment a second control is added it lands between the brand and the rail
instead of in it.
*/
.sidebar__header {
display: flex;
align-items: center;
gap: var(--sp-2);
height: var(--header-height);
padding: 0 var(--sp-3);
flex: none;
}
.sidebar__brand-slot {
flex: 1 1 auto;
min-width: 0;
display: flex;
align-items: center;
}
/* On the trailing edge, whatever the writing direction, and sized by its
contents rather than by what is left over. */
.sidebar__actions-rail {
flex: none;
display: flex;
align-items: center;
gap: var(--sp-1);
margin-inline-start: auto;
}
.sidebar__brand {
display: flex;
align-items: center;
@@ -1257,7 +1284,6 @@ body.is-resizing .canvas__body { pointer-events: none; }
.sidebar__close {
display: inline-flex;
margin-left: auto;
}
/* Dismissible by tapping beside it. Without this the only way out is a