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

Wave-5 reskin batch 3: header title in CMU serif, markdown gets lh-prose

Browse Source 
- Session title: font-title (CMU Serif bold) at text-2xl, per the mock.
- MessageResponse's markdown container now carries .lh-prose (Source
  Sans 3 + emphasis tokens) on every markdown surface; labels stay
  JetBrains Mono. Unlayered plain CSS beats the text-sm utility.
- PhaseChip + PhaseDivider sizes now pull from the declared text ladder
  (text-xs) instead of pixel literals.
This commit is contained in:
amosblomqvist
2026-09-12 23:45:44 +03:00
parent 4caea4c8fb
commit a6d3883422
3 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/ai-elements/message.tsx
+3 -1
View File
@@ -384,7 +384,9 @@ export const MessageResponse = memo(
return ( return (
<Streamdown <Streamdown
className={cn( className={cn(
"size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", // Source Sans 3 + emphasis-color tokens on every markdown surface
// (labels stay JetBrains Mono). Unlayered plain CSS wins over text-sm.
"lh-prose size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0",
className className
)} )}
mermaid={mermaidOptions} mermaid={mermaidOptions}
components/chat.tsx
+1 -1
View File
@@ -459,7 +459,7 @@ export function Chat({
when it disappears and slide the title + chip up. */} when it disappears and slide the title + chip up. */}
<header className="flex h-10 items-center gap-3 px-3"> <header className="flex h-10 items-center gap-3 px-3">
<SidebarToggle /> <SidebarToggle />
<div className="min-w-0 flex-1 truncate font-medium">{title}</div> <div className="min-w-0 flex-1 truncate font-title text-2xl tracking-tight">{title}</div>
<PhaseChip phase={phases.at(-1) ?? "probe"} /> <PhaseChip phase={phases.at(-1) ?? "probe"} />
</header> </header>
components/phase-divider.tsx
+2 -2
View File
@@ -36,7 +36,7 @@ export function PhaseChip({ phase }: { phase: Phase3 }) {
data-testid="phase-chip" data-testid="phase-chip"
data-phase={phase} data-phase={phase}
title={`Session phase: ${CHIP_LABEL[phase]}`} title={`Session phase: ${CHIP_LABEL[phase]}`}
className="flex shrink-0 items-center gap-1.5 rounded-full border border-border/80 px-2 py-0.5 text-[11px] font-medium uppercase tracking-wide text-muted-foreground" className="flex shrink-0 items-center gap-1.5 rounded-full border border-border/80 px-2 py-0.5 text-xs font-medium uppercase tracking-wide text-muted-foreground"
> >
<span className={cn("size-1.5 rounded-full", PHASE_DOT[phase])} aria-hidden /> <span className={cn("size-1.5 rounded-full", PHASE_DOT[phase])} aria-hidden />
{CHIP_LABEL[phase]} {CHIP_LABEL[phase]}
@@ -71,7 +71,7 @@ export function PhaseDivider({ phase, nodeCount }: { phase: Phase3; nodeCount?:
<span className={cn("h-0 flex-1 border-t-2 border-dotted", DIVIDER_RULE[phase])} aria-hidden /> <span className={cn("h-0 flex-1 border-t-2 border-dotted", DIVIDER_RULE[phase])} aria-hidden />
<span <span
className={cn( className={cn(
"rounded-full border px-2.5 py-0.5 text-[11px] font-medium uppercase tracking-wide", "rounded-full border px-2.5 py-0.5 text-xs font-medium uppercase tracking-wide",
DIVIDER_TEXT[phase], DIVIDER_TEXT[phase],
)} )}
> >