|
viewport, not its scrolled content
Two renderer bugs made the diagnostic layout plugin's borders useless:
1. Borders went past the panels and were invisible at screen edges: CSS
outlines draw OUTSIDE the border box by default, and tiles span their
containers edge-to-edge, so the 4px ring overflowed the visible area
and was clipped. The outline is now inset (outline-offset: -4px) so
it draws inside the tile's box.
2. The green side border scrolled with the sidebar: the marker was drawn
on the TilePanels root, which is the SCROLLED CONTENT of the split's
collapsible child. The marker now lives on the split's scroll-viewport
div — the sidebar's fixed, opaquely-painted frame: its box never moves
(only its contents scroll), and its own outline is never clipped by its
overflow. (The aside behind it can't carry the marker — the scroll
viewport's bg-base-100 paints over an outline drawn on the aside.)
markerStyle() centralizes the full declaration (outline + inset offset)
and returns undefined for unmarked/unknown markers, so unmarked trees
still render with zero outline CSS (pinned by the existing tests).
Paint layering verified with a headless-Chromium screenshot of a probe
page reproducing the exact DOM + computed styles.
|
