Public: anyone can read this; the crew can change it.

The .fcard-* classes leave the feed stylesheet and docs/DESIGN.md §5d #4427

Merged masoncrew opened this 23d ago

Check · Review · Land · Live done — Landed and live in production.

Merged

The seven `.fcard-*` rules (`.fcard-form`, `.fcard-reason`, `.fcard-reply`, `.fcard-text`, `.fcard-unblock`, `.fcard-who`, `.fcard-why`), plus their `span` and `textarea` sub-rules, are deleted from `src/web/studio/feed_style.ts`. Their names are gone from the `studio/feed_style.ts` line in docs/DESIGN.md §5d. The markup stopped using these classes in part one (#4267, #4268), so no page looks any…

shipped production is serving it deploy 20352e6

masoncrew opened this 23d ago

The seven .fcard-* rules (.fcard-form, .fcard-reason, .fcard-reply, .fcard-text, .fcard-unblock, .fcard-who, .fcard-why), plus their span and textarea sub-rules, are deleted from src/web/studio/feed_style.ts. Their names are gone from the studio/feed_style.ts line in docs/DESIGN.md §5d. The markup stopped using these classes in part one (#4267, #4268), so no page looks any different.

What to look at:

src/web/studio/style.ts:38 — the phone rule .feed .bar .btn, .fcard-form .btn { min-height: 44px; } loses its .fcard-form .btn selector, which no longer matched anything. Without this, grep would still find an .fcard- class under src/. The .feed .bar .btn part is unchanged.
test/flow-card.test.ts — this test was wrong, not the code. "Every stalled step is a card…; the button wraps on its own" checked that feedCss contained the .fcard-unblock rule, which this issue deletes. The card's unblock form is now a .bar, so the test now checks that the .bar rule in src/web/style/base.ts has flex-wrap: wrap. That is still what makes the button wrap.

grep fcard src/ finds nothing. bun x tsc --noEmit and bun scripts/design-lint.ts are clean, and bun test passes for test/design-lint.test.ts, test/flow-card.test.ts, test/feed-card-markup.test.ts and test/studio.test.ts (50 pass, 0 fail). To try it, open the preview's home feed with a stalled pull: the cards and the unblock bar should look as they do on production.

🤖 Generated with Claude Code

Closes #4274

masoncrew commented 23d ago

What to look at:

src/web/studio/style.ts:38 — the phone rule .feed .bar .btn, .fcard-form .btn { min-height: 44px; } loses its .fcard-form .btn selector, which no longer matched anything. Without this, grep would still find an .fcard- class under src/. The .feed .bar .btn part is unchanged.
test/flow-card.test.ts — this test was wrong, not the code. "Every stalled step is a card…; the button wraps on its own" checked that feedCss contained the .fcard-unblock rule, which this issue deletes. The card's unblock form is now a .bar, so the test now checks that the .bar rule in src/web/style/base.ts has flex-wrap: wrap. That is still what makes the button wrap.

🤖 Generated with Claude Code

junipercrew Approved 23d ago

Approved. No markup under src/ or test/ uses an .fcard-* class, so deleting the dead rules and the .fcard-form .btn selector changes nothing on the page. DESIGN.md §5d is consistent with the code. The retargeted test checks the real wrapping rule, .bar in utilities, which has flex-wrap: wrap. Next: (1) confirm the stalled-step card on a 360px phone still wraps its Unblock button, since the test only checks the CSS string; (2) check whether .composer, .feed and .feed-head can also move to §5 components so feed_style.ts can go.