Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 6 additions & 7 deletions docs/markdown-rendering.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

Every page that shows model output — Chat, Revise, Draft — renders it through
`frontend/src/components/markdown`. Use that component rather than React
Markdown directly: it carries the GFM plugin, the element styles Tailwind
Markdown directly: it carries the GFM plugin, the element styles preflight
strips, and the table wrapper, and it is the only module in the app that
imports `react-markdown`, which is what kept swapping the renderer underneath
down to four call sites.
Expand Down Expand Up @@ -55,13 +55,12 @@ so Revise and Chat render them identically. A page wires it up with
one `<DocJumpStatus>`; it also has to tell the model how to write the links,
since nothing will emit them otherwise.

## Tailwind's preflight eats list formatting
## Preflight eats list formatting

`@import 'tailwindcss'` (in `src/taskpane.css` and `src/editor/styles.css`)
pulls in preflight, which resets `ul`/`ol` to `list-style: none` with no
padding, and headings to plain body text. Nothing put those back for markdown
we render ourselves, so a bulleted reply arrived as an undifferentiated run of
lines.
`src/preflight.css` (imported by `src/taskpane.css` and `src/editor/index.tsx`)
resets `ul`/`ol` to `list-style: none` with no padding, and headings to plain
body text. Nothing put those back for markdown we render ourselves, so a
bulleted reply arrived as an undifferentiated run of lines.

`components/markdown/styles.module.css` restores them. It works without
`!important` or a specificity ladder because preflight lives in `@layer base`
Expand Down
8 changes: 4 additions & 4 deletions frontend/CLAUDE.md
Original file line number Diff line number Diff line change
Expand Up @@ -134,10 +134,10 @@ kept outside it.

Pages render markdown through `<Markdown>` (`src/components/markdown/`), which
is the only module that imports `react-markdown`. It carries `remark-gfm` (plain
`remark-parse` is CommonMark, which has no tables) and the element styles
Tailwind's preflight strips — lists lose their marker and indent without them.
Preflight sits in `@layer base` and unlayered CSS beats layered CSS, so a CSS
module overrides it with no `!important`.
`remark-parse` is CommonMark, which has no tables) and the element styles the
preflight reset strips — lists lose their marker and indent without them.
Preflight (`src/preflight.css`) sits in `@layer base` and unlayered CSS beats
layered CSS, so a CSS module overrides it with no `!important`.

Callers pass their own element components via `components` (define them at
module scope — React remounts a subtree whose component identity changed). React
Expand Down
2 changes: 1 addition & 1 deletion frontend/eslint.config.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ export default [

// Node.js config files
{
files: ['*.config.js', 'tailwind.config.js'],
files: ['*.config.js'],
languageOptions: {
ecmaVersion: 'latest',
sourceType: 'commonjs',
Expand Down
Loading
Loading