commit b6316a160f3a4d7e1c27ddd24b78a9a30a168946
parent b06598203b622a6b6ea5855c27599c3cb0675bac
Author: I Mean I'm Just Saying <imeanimjustsaying@kiwifarms.st>
Date: Sun, 13 Sep 2026 18:09:59 -0400
channels: the corpus-wide cluster sits beside the title
At 1440 the EVERY CHANNEL cluster wrapped UNDER the subtitle instead of
sitting to its right. The freshness note is three lines of prose, not a
tagline, and at its max-w-3xl ceiling it claimed 768px of a 1216px content
column - so 768 + ~530px of buttons overflowed, the wrapping header broke,
and the three pool-wide buttons landed on a band of their own. Which is the
undifferentiated row of pills this whole change exists to remove.
The header is md:flex-nowrap now, the left block md:flex-1 with min-w-0 so
the paragraph rewraps into whatever is left (max-w-3xl stays a ceiling, not
a floor), and the cluster md:shrink-0 md:self-start at the top right. The
header measures 80px instead of ~150 and the rack gains a row: 14 channels
on screen at 1440x900. Below md it still wraps and the cluster still stacks
full-width; 390px shows no horizontal overflow.
Text, testids and accessible names are untouched.
Also records the run: the Shipped section enumerates the commit range rather
than naming a tip it cannot know, and carries this as a seventh divergence.
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Diffstat:
2 files changed, 28 insertions(+), 8 deletions(-)
diff --git a/editor/app/channels/page.tsx b/editor/app/channels/page.tsx
@@ -265,8 +265,17 @@ export default async function ChannelsPage({
// fixed chrome and the rack between them is the only thing that moves.
// Below md there is no height and the document scrolls as it always has.
<div className="flex flex-col gap-3 md:h-[calc(100vh-3rem)] md:min-h-0">
- <header className="flex flex-wrap items-start justify-between gap-x-4 gap-y-2 shrink-0">
- <div className="min-w-0">
+ {/* NOWRAP ON md+, AND THE SUBTITLE IS WHAT GIVES. The freshness note is
+ three lines of prose, not a tagline: at its max-w-3xl ceiling it
+ claimed 768px of a 1216px content column, which left no room for the
+ corpus-wide cluster and dropped it onto a band of its own — the same
+ undifferentiated row of pills this change exists to remove. So the
+ left block takes whatever is left and the paragraph rewraps into it
+ (max-w-3xl stays a ceiling, never a floor), and the cluster keeps its
+ intrinsic width at the top right. Below md the header still wraps and
+ the cluster still stacks full-width. */}
+ <header className="flex flex-wrap items-start justify-between gap-x-4 gap-y-2 shrink-0 md:flex-nowrap">
+ <div className="min-w-0 md:flex-1">
<h1 className="text-2xl font-semibold">Channels</h1>
{/* THE FRESHNESS NOTE IS THE PAGE'S CAVEAT, so it sits with the
page's title. It used to be the last thing on the page, in 11px
@@ -315,7 +324,7 @@ export default async function ChannelsPage({
channel and is the page's actual call to action. So the three are
outlines under an eyebrow that says what they act on, and only
"New channel" is filled. */}
- <div className="flex w-full flex-col items-start gap-1 md:w-auto md:items-end">
+ <div className="flex w-full flex-col items-start gap-1 md:w-auto md:shrink-0 md:items-end md:self-start">
<span className="font-mono text-[10px] uppercase tracking-[0.16em] text-muted-foreground">
Every channel
</span>
diff --git a/plans/editor-channels-rack.md b/plans/editor-channels-rack.md
@@ -303,9 +303,12 @@ No server action, no `actions.ts`, no `common/` change, no e2e spec renamed. `Me
## Shipped
Branch `editor-channels-rack`, forked from `main` @ `a1058d0`. Commit range
-`64b5573..<tip>` (`64b5573` the plan, `4bb2a0a` step 1, `278d446` step 2,
-`76a1e1e` step 3, `b57b59b` step 4, `662fdf1` step 5, `75b7f37` step 6,
-`20ee34d` the polish pass the rendered page called for, plus the record commit).
+`64b5573..HEAD`, which is these ten in order: `64b5573` the plan, `4bb2a0a`
+step 1, `278d446` step 2, `76a1e1e` step 3, `b57b59b` step 4, `662fdf1` step 5,
+`75b7f37` step 6, `20ee34d` the polish pass the rendered page called for,
+`92fa9d8` the first record, and THIS commit — the header fix below plus this
+paragraph. (A commit cannot name its own hash, so the tip is enumerated rather
+than spelled; `git log --oneline main..` prints it.)
**Rationale.** The page's problem was never that it showed too much — it is a
console for a 67-channel corpus and every column earns its place — but that it
@@ -326,8 +329,8 @@ and each row keeps a chip (full reason on `title` and for a screen reader); the
three pool-wide buttons are outlines under an eyebrow naming what they sweep, and
`New channel` is the only fill.
-**Measured.** Rows 41px (was ~90): 13 channels on screen at 1440×900 where 7 fit
-before. The deck is 48px tall at 1440 and 176px at 390. `prefers-reduced-motion:
+**Measured.** Rows 41px (was ~90): 14 channels on screen at 1440×900 where 7 fit
+before, with the header at 80px (211px on a 390px viewport, where it stacks). The deck is 48px tall at 1440 and 176px at 390. `prefers-reduced-motion:
reduce` computes `animation-name: none` on the deck (`enter` otherwise). Tab order
runs header buttons → focus line → table → deck, with the deck last in the
document's focus order and the sticky cells trapping nothing.
@@ -374,3 +377,11 @@ first attempt.
the attribute.
- `ChannelFocusBar` moved to its own file and exports `useBarAction`, which the
deck shares — the plan allowed either.
+- The header is `md:flex-nowrap` with the SUBTITLE shrinking, because the
+ freshness paragraph is three lines and not a tagline: at its `max-w-3xl`
+ ceiling it claimed 768px of a 1216px column, the header wrapped, and the
+ corpus-wide cluster dropped onto a band of its own — the undifferentiated row
+ of pills this change exists to remove. The left block is `md:flex-1 min-w-0`
+ so the paragraph rewraps into what is left (the cap stays a ceiling, never a
+ floor) and the cluster keeps its intrinsic width top-right. Header 80px at
+ 1440 instead of ~150. Below md it still wraps and stacks.
