sorokin.oleg.edu/learnharness
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 6 Wiki Activity

Header round 6 (owner): the top bar grows to 60px — aligned to the sidebar's LH band

Browse Source 
h-10 → h-15 (60px) in both the chat header and the /chat/new draft
header. 60px is an alignment, not just a size: it equals the sidebar's
LH wordmark band, so the header's border-b continues that band's bottom
edge as one horizontal line across the app — the sidebar's 'New session'
row begins exactly where the chat column's chrome ends.

Live: header border-b at y=60, wordmark band bottom at y=60. Gates:
typecheck, lint, 469/469.
This commit is contained in:
amosblomqvist
2026-09-17 13:52:18 +03:00
parent 70ddc21610
commit c451f4f144
2 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/chat.tsx
+8 -4
View File
@@ -584,10 +584,14 @@ export function Chat({
{/* The top bar is its own block (owner, top-fade round 4): in flow
above the scroller on the plain page background — no gradient. Its
bottom outline (border-b border-border) matches the one that
separates the left sidebar — same width, same color (owner, r5). h-10, not py-2: the toggle (a size-9 icon button)
renders only while the sidebar is CLOSED — an auto-height row
would collapse when it disappears and slide the title + chip up. */}
<header className="flex h-10 items-center gap-3 border-b border-border px-3">
separates the left sidebar — same width, same color (owner, r5).
h-15 (60px), not py-2: the toggle (a size-9 icon button) renders
only while the sidebar is CLOSED — an auto-height row would
collapse when it disappears and slide the title + chip up.
60px is an ALIGNMENT, not just a size: it equals the sidebar's
LH wordmark band, so the header's border-b continues that
band's bottom edge as one line across the app (owner, round 6). */}
<header className="flex h-15 items-center gap-3 border-b border-border px-3">
<SidebarToggle />
<div className="min-w-0 flex-1 truncate font-title text-2xl tracking-tight">{title}</div>
{/* The plan chip (owner, plan-placement round): session-level
components/new-session.tsx
+3 -1
View File
@@ -77,7 +77,9 @@ export function DraftShell({
return (
<div className="flex h-dvh">
<div className="flex min-w-0 flex-1 flex-col">
<header className="relative flex h-10 items-center gap-3 px-3">
{/* h-15 (60px) matches the chat header and the sidebar's LH wordmark
band (owner, round 6). */}
<header className="relative flex h-15 items-center gap-3 px-3">
<SidebarToggle />
<div className="min-w-0 flex-1 truncate font-title text-2xl tracking-tight">New session</div>
<PhaseChip phase="probe" />