Skip to content

fix(control-plane): restore Reflect Markdown typography - #4777

Merged
nicoloboschi merged 3 commits into
vectorize-io:mainfrom
divideby0:fix/reflect-markdown-typography
Oct 5, 2026
Merged

nicoloboschi merged 3 commits into
vectorize-io:mainfrom
divideby0:fix/reflect-markdown-typography

Conversation

@divideby0

@divideby0 divideby0 commented Sep 25, 2026 •

Copy link
Copy Markdown

Reflect answers currently lose paragraph spacing, heading hierarchy, and list markers. The UI uses prose classes, but Tailwind v4 does not automatically load the typography plugin registered in the legacy JavaScript config. Long answers consequently read as a dense block of text.

This registers the existing typography dependency in CSS, following Tailwind's v4 instructions. Reflect answers use 16px body text with 28px line spacing, clear heading sizes, and text blocks capped at 70ch. Tables and code can use the card width; wide tables scroll within the answer without compressing words into narrow columns. Table scroll positions survive edits to the Reflect controls. The existing Inter and JetBrains Mono fonts remain.

The plugin replaces the manual Markdown table overrides and restores styling for other existing prose consumers, including directives and Reflect observation details. CompactMarkdown opts out with not-prose to preserve its own compact styles.

Before and after

The same invented astronomy-club response is shown in both captures. All names and content are fictional. API responses were intercepted locally; the screenshots contain no user or bank data. Fixture and capture notes.

Before After
Before: missing paragraph gaps, list markers, and heading sizes After: restored spacing, heading hierarchy, and list markers

Validation

The current branch is rebased onto main at a921929a0. Local tests, lint, and build checks cover d3c1438743624314043f457a2af877c83d087c7f; Git range-diff confirms both PR patches are unchanged by the rebase.

  • CI on this head completed with 78 successful checks and 23 skipped; no failures.
  • Compiled-CSS regression test fails before the plugin registration and passes afterward.
  • Control-plane tests: 40 files, 285 tests passed (TZ=UTC, two workers).
  • Repository lint/type checks and control-plane production build passed. The Meta Muse integration also passed all 17 tests locally after the rebase.
  • Initial Chromium checks covered light/dark at 1440, 768, and 390px, 200% text scaling, nested lists, and compact-renderer sizing. Independent review then identified table compression and scroll resets that those checks missed.
  • Follow-up regressions fail at the initial PR head and pass with the fixes: a rendered ThinkView test preserves table identity after a query edit, and a compiled-CSS check guards the wrapping rule.
  • Full-page Chromium reproduction at 1440 and 375px in light/dark mode confirms that a six-column table scrolls at phone width (514px inside a 213px container), long paragraph URLs wrap, and query edits preserve a 140px table scroll position. API responses use fictional fixtures. Safari/WebKit keyboard navigation remains unverified.
  • Follow-up CodeRabbit review completed with no findings across the four changed files. The initial review suggested improving pre-existing fenced-code scrolling in CompactMarkdown; that remains outside this fix.

The earlier Meta Muse CI setup failure occurred before tests: the newer workflow referenced an integration directory absent from the old PR head. Rebasing brings that upstream integration into the checkout without changing the typography patch.

AI assistance

Codex investigated the CSS pipeline, implemented the changes and regression tests, generated the fictional response, ran the checks, and drafted this description. Impeccable supplied typography guidance. An independent review using Codex, Claude Code, CodeRabbit, and SonarQube found the table compression and renderer-identity regressions; Codex reproduced and fixed both. The external evie-kit humanizer checked the PR prose. Evie-kit is the contributor's development toolkit for agent workflows and writing checks; no evie-kit configuration was installed in Hindsight.

This is separate from retain-context PR #4751.

@divideby0

Copy link
Copy Markdown
Author

A follow-up on related work: I should have checked for duplicate issues and PRs before opening this draft. A search across open and closed issues/PRs for typography, Markdown rendering, prose, Tailwind, spacing, and fonts found no direct duplicate of the missing typography-plugin registration fix, though search is not conclusive.

The relevant earlier work is:

This PR retains those fonts, enables the existing typography plugin under Tailwind v4, and replaces the manual table rules with the plugin's styling. The deliberate preservation in #3149 is useful review context: replacing those rules deserves checks across the shared Markdown consumers, including light/dark tables and the compact renderer. The existing browser checks cover Reflect and the rendered compact component; they do not constitute a browser walkthrough of every shared consumer.

I'll continue reviewing this as a focused follow-up to that work. The before/after examples use entirely fictional content.

AI assistance: Codex helped research and draft this comment; I personally reviewed the findings and recommendations.

@divideby0
divideby0 force-pushed the fix/reflect-markdown-typography branch from 8a44220 to d3c1438 Compare September 25, 2026 20:34
… comment

- remove .github/figures/reflect-typography (screenshots belong in the PR description only)
- typography.test.ts: name overflow-wrap: anywhere explicitly in the comment
@nicoloboschi
nicoloboschi marked this pull request as ready for review October 5, 2026 16:24
@nicoloboschi
nicoloboschi merged commit b32e992 into vectorize-io:main Oct 5, 2026
100 checks passed
@nicoloboschi nicoloboschi mentioned this pull request Nov 3, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants