Code blocks

Fenced code blocks with optional language hints, monospace rendering, and the same Markdown source on disk that GitHub and every other tool uses.

Code blocks in sweetdocs are plain GFM fenced blocks — three backticks, optional language hint, your code in the middle. They’re stored exactly that way in the Markdown source, so round-tripping into and out of any other Markdown tool is lossless.

javascriptconst greet = (name) => `Hello, ${name}!`

console.log(greet('Kyoto'))
console.log(greet('Osaka'))
// → "Hello, Kyoto!"
// → "Hello, Osaka!"

Inserting a code block

Once you’re inside a code block, all Markdown formatting is disabled — backticks, asterisks, and underscores all render as literal text. Only plain typing and newlines.

Language hints

Add a language tag after the opening fence:

```javascript
const greet = name => `Hello, ${name}!`
```

The language is preserved in the source but there is no syntax highlighting in v1 — code renders as plain monospace with a subtle background and a soft border. The hint matters because:

• It travels with the doc through export (.md, .docx, .pdf)
• It’s preserved when you copy the block to GitHub, Notion, or any other Markdown tool that does highlight
• It’s structurally correct GFM

Any string is accepted as a language hint — python, bash, tsx, mermaid, nginx, whatever. No allowlist.

If you don’t add a hint, the block is still a code block — it just has no language-… class on the rendered <code> element.

Styling

The styling is identical in Edit mode and Preview mode — you’re looking at the same CSS in both places.

Inline code

Inline code uses single backticks: `like this` — small monospace, subtle pill background, accent text color, rounded edge. Same syntax everywhere:

Use the `useEffect` hook for side effects.

This is a separate Markdown construct from a fenced block. Use inline code for short identifiers and short snippets inside prose; use fenced blocks for anything that needs its own lines.

Editing inside a block

There’s no language selector dropdown, no copy button, no line numbers, no folding, and no inline Monaco editor in v1. The block is intentionally simple — what you write is what gets saved.

Round-trip behavior

Because the on-disk shape is plain GFM:

• Paste a fenced block from GitHub, Stack Overflow, ChatGPT, anywhere — comes in as a real code block (the Markdown paste extension handles this).
• Copy out of sweetdocs: the rendered block copies as plain text, the source as Markdown.
• Export to Markdown: the fenced block survives exactly, including the language hint.
• Export to DOCX / PDF: the code renders in a monospace style (no highlighting, no language label).
• Public link viewer: the same marked + DOMPurify pipeline as Preview mode, with the same monospace styling.

What’s not in v1