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

ui: round three — the tight band, one geometry everywhere

Browse Source 
Owner round three on the user rows: (1) the band padding halves,
py-2.5 -> py-[5px] — subtle, not tall; same for the messages. (2) The
in-card thinking joins the band: identical styling and heights for
collapsed thinking in the chat and inside question cards (card-on-card
is quiet by design; revert if it reads too light). (3) The left gap
MATCHES the new 5px padding, so the rail fills the rest of the 3ch
inset - border-l-[calc(3ch-5px)] pl-[5px]: a thick muted rail, total
inset still 3ch (the chevron-alignment law survives). The banded prop
dies - one geometry, cards included.
This commit is contained in:
amosblomqvist
2026-10-08 18:32:21 +03:00
parent 3691e07118
commit 497b29804c
6 changed files with 39 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/render-md-blocks.test.tsx
+4 -11
View File
@@ -242,24 +242,17 @@ describe("md-blocks — the restored plain blockquote (owner round, 2026-10-07)"
});
});
describe("ThinkingBlock — side-based authorship + ⌘T sync (owner round, 2026-10-07)", () => {
it("the banded row is the document band — full-width card color, 6px rail", () => {
describe("ThinkingBlock — the document band + ⌘T sync (owner rounds, 2026-10-07)", () => {
it("the row is the document band — one geometry, cards included (owner round three)", () => {
const html = renderToStaticMarkup(<ThinkingBlock text="banded" defaultOpen />);
assert.ok(html.includes("bg-card"), "the card-color band");
assert.ok(html.includes("border-l-[6px]"), "the 6px rail");
assert.ok(html.includes("pl-[calc(3ch-6px)]"), "natural gap, 3ch total inset preserved");
assert.ok(html.includes("border-l-[calc(3ch-5px)]"), "the rail fills the 3ch inset");
assert.ok(html.includes("py-[5px]") && html.includes("pl-[5px]"), "tight 5px padding, gap matches it");
assert.ok(html.includes("w-full"), "full width — no chat side");
assert.match(html, /aria-expanded="true"/);
assert.ok(html.includes("banded"), "text visible on arrival");
});
it("in-card rows take the rail but no band", () => {
const html = renderToStaticMarkup(<ThinkingBlock text="in card" banded={false} />);
assert.ok(!html.includes("bg-card"), "no band on the card's own background");
assert.ok(html.includes("border-l-[6px]"), "the rail stays");
assert.ok(html.includes("my-3"), "the 12px in-card rhythm");
});
it("⌘T sets every row — explicit sets stomp individual state, late mounts honor the last set", () => {
setAllUserThinkingOpen(false);
const collapsed = renderToStaticMarkup(<ThinkingBlock text="synced" defaultOpen />);