oficina / docs Public

fix(chrome): the document screen, on a phone

Four things Paul named looking at the editor at phone width, and one
the first fix of them uncovered.

The app title goes. "Documents" sat beside the document's own name in
the shell bar, which is the one place a person does not need telling
which app they are in. The route home it carried is not lost — it moves
into [rst-shell-nav], which the topbar shell already collapses into the
menu below 800px, so the link is still an ordinary <a href="/"> that
works with scripts off. Above 800px the brand carries it as before, and
the two are written as a complementary pair against rastrillo's own
breakpoint so there is no width that shows both or neither.

The bar's disclosure is a flat icon and a floating panel, not a
bordered button that pushes the document down a row.

The open menu's title squares its corners. Paul: "active state looks
wrong because of the rounded edges on the active state" — a rounded box
flush on a square-topped panel leaves two notches of bar at the seam.

The z-index bug: an open Format menu rendered UNDER the three
comboboxes. The panel already asked for z-index 4 and got it at desktop
widths; below 30rem the narrow block gave [docs-menubar]
`position: sticky`, and a sticky element establishes a stacking context
whether or not it has a z-index, so the 4 stopped meaning "above the
chrome". The sticky was redundant anyway — [docs-chrome] is the one
sticky element — so the ordering it was deciding by accident is now
stated: menus above, formatting below.

And the formatting rail no longer wraps. Below 30rem everything past
undo/redo goes behind a "..." at the trailing end and opens as one panel
under the bar; above it the wrapper is `display: contents` and the
desktop bar is unchanged. Two things the screenshots caught on the way:
font-size: 0 (which hides the shell menu's label, a bare text node with
no element of its own) also collapsed the framework's em-sized icon to
nothing, and the roving tabindex would park the bar's only tab stop on
a control hidden inside the closed panel — so it now skips what a
person cannot see, and normalises rather than trusting that whatever set
a tabIndex demoted the rest. rastrillo's ui/select.js builds the three
comboboxes as plain <input>s, and an <input> is tabbable before anything
touches it: with the panel open the bar had four tab stops where it
promises one.

Verified in Chromium at 320, 390 and 1280: no horizontal scroll at any
of them, one toolbar row at all three, one tab stop with the panel open
and closed, and the Format panel's own hit test returns a menu item
where it used to return a combobox. scripts/browser-drive.sh 44/44,
fixtures 97/97, go test ./internal/docs ok.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_014jpLiN9xwBrZ5dJw92aYmF