Install shadcn/typeset in this Fumapress (Fumadocs + Waku) project. Typeset is a single stylesheet that styles rendered markdown: wrap the output in a `typeset` container and everything inside (headings, lists, tables, code, blockquotes, math) is styled. Everything outside is untouched. If this project was scaffolded with create-fumapress-typeset, steps 1-4 are already done — verify each one and move on; every step below is safe to re-run. 1. Download https://ui.shadcn.com/typeset.css and save it as `src/typeset.css` (next to the main CSS file, `src/app.css`). If the file already exists, replace it with the downloaded copy. 2. Import it in `src/app.css`, after the Tailwind and Fumadocs imports: @import "./typeset.css"; 3. Install the fonts: bun add @fontsource-variable/dm-sans @fontsource-variable/instrument-sans @fontsource-variable/jetbrains-mono Then import them in `src/app.css`: @import "@fontsource-variable/dm-sans"; @import "@fontsource-variable/instrument-sans"; @import "@fontsource-variable/jetbrains-mono"; :root { --font-dm-sans: "DM Sans Variable", sans-serif; --font-instrument-sans: "Instrument Sans Variable", sans-serif; --font-jetbrains-mono: "JetBrains Mono Variable", monospace; } 4. Add this preset to `src/app.css`, after the typeset import. If a class named `.typeset-docs` already exists, update its values in place. Leave any other `typeset-*` presets untouched: they are separate surfaces: .typeset-docs { --typeset-font-body: var(--font-instrument-sans); --typeset-font-heading: var(--font-dm-sans); --typeset-font-mono: var(--font-jetbrains-mono); --typeset-size: 16px; --typeset-leading: 1.9; --typeset-flow: 1em; } 5. Do not apply the class anywhere yet. Search the project for surfaces that render markdown or rich content: - The Fumadocs docs page body. Fumapress owns that layout: customize it in `press.config.tsx` with `createDocsLayoutPage` from "fumapress/layouts/docs" (see https://press.fumadocs.dev/docs/layouts) and wrap the page body there. - MDX components, react-markdown/Streamdown renderers, dangerouslySetInnerHTML with parsed markdown, `prose` classes, CMS content renderers. Present the candidates you find as a short list and ask the user which surface should use typeset. Then wrap only the surface they pick:
{content}
(`src/app.css` also defines `.typeset-measure` with the same max-width, if a plain class is preferred over a Tailwind utility.) If the picked surface already has its own typography (Fumadocs' `prose` class, styled markdown components), list those styles and let the user decide what to remove before wrapping. Note: `src/app.css` already zeroes `margin-block-end` inside `.typeset.prose` so typeset owns the rhythm when both classes share a container. Notes: - To exclude an embedded component from typeset styles, add the `not-typeset` class or the `data-not-typeset` attribute to it. Keep interactive Fumadocs components (tabs, callouts, accordions) out of typeset this way. - Verify on the surface the user picked: headings, lists, tables, and code inside the container should be styled with no classes on the content itself. - Docs: https://ui.shadcn.com/docs/typeset