Bottom-edge height pill on tiles; fullscreen fit runs every column to the bottom
Tiles get a third resize handle: a pill on the bottom edge (hover-only, between the two corner handles) that moves that edge. With nothing directly below, it changes just the tile's height. When other tiles share the edge, the drag trades rows with them so the column keeps its total height — the vertical counterpart of the seam pill. Clamped to every tile's minimum height; blocked by collisions like the corner handles. Fullscreen auto-fit reworked so columns actually reach the bottom of the screen. The old rule only stretched tiles whose bottom edge was within two rows of the viewport bottom, which on a display taller than the browser window the layout was designed in left a blank band below every column. Now the bottom-most tile of each column stretches to the bottom regardless of distance. Short tiles (h <= 2, the clock) are never stretched into a ribbon: under another tile they drop to the bottom edge and the tile above grows into the gap (stopping at anything else below it); alone in their columns they stay put. The fit re-runs from a ResizeObserver on the grid area, so the browser's animated fullscreen transition and the menubar collapse both settle into a correct fit (replaces the resize/transitionend listeners). README documents the pill and the fullscreen behaviour. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01RNYUv9EyrGSFmCnmH7WYKH
This commit is contained in:
@@ -90,10 +90,21 @@ ignored from then on.
|
||||
|
||||
- **+** — add any enabled module; multiple tiles of the same module are
|
||||
fine (e.g. two transcripts filtered to different channels).
|
||||
- Drag a tile by its **title bar** to move it; drag the **corner handle**
|
||||
to resize; **✕** removes it. Tiles sit flush — when two share an edge,
|
||||
hover the seam and a small grab pill appears; drag it to trade width
|
||||
between the two tiles (macOS split-view style).
|
||||
- Drag a tile by its **title bar** to move it; drag either **bottom
|
||||
corner** to resize; **✕** removes it. Hover a tile and a small pill
|
||||
appears on its **bottom edge** — drag it to change just the height. If
|
||||
another tile sits directly below, the pill moves the shared edge instead,
|
||||
trading rows between the two so the column keeps its total height. Tiles
|
||||
sit flush — when two share a vertical edge, hover the seam and the same
|
||||
kind of pill appears; drag it to trade width (macOS split-view style).
|
||||
- **Fullscreen** (the ⛶ button) is a viewing mode: the menu bar hides, the
|
||||
occupied columns stretch to the full width, and every column runs to the
|
||||
bottom of the screen — the last tile in each column is stretched to end
|
||||
there. A short tile like the clock is never stretched into a ribbon: under
|
||||
another tile it slides to the bottom edge and the tile above grows into the
|
||||
gap; alone in its columns it stays as it is. Nothing is saved — the layout
|
||||
reverts when you leave fullscreen. A layout deeper than the screen keeps
|
||||
its normal row height and scrolls.
|
||||
- A tile's actions (menus, text size, clear…) live in its **title bar**;
|
||||
the small **notch** on the bar's bottom edge hides/shows the whole bar
|
||||
for a clean wall-display look.
|
||||
|
||||
Reference in New Issue
Block a user