Markdown Rendering
SlopDrop renders markdown files as styled HTML pages when viewed in the browser.
Supported Features
| Feature | Syntax | Status | |
|---|---|---|---|
| Headers | # H1 through ###### H6 |
✅ | |
| Bold / Italic | bold, italic |
✅ | |
| Inline code | ` code ` |
✅ | |
| Code blocks | `lang |
✅ | |
| Tables | GFM pipe tables with alignment | ✅ | |
| Lists | - item, 1. item, - [ ] task |
✅ | |
| Blockquotes | > quote |
✅ | |
| Callouts | > [!NOTE], > [!TIP], etc. |
✅ | |
| Links | [text](url) |
✅ | |
| Wiki-links | [[target]], `[[target\ |
display]]` | ✅ |
| Horizontal rules | --- |
✅ | |
| Strikethrough | ~~text~~ |
❌ Planned | |
| Syntax highlighting | Language-specific coloring | ❌ Planned |
Wiki-Links
Obsidian-style wiki-links are supported. They resolve relative to the current document's directory.
See [[architecture]] → links to architecture.md in same dir
See [[specs/architecture]] → links to specs/architecture.md
See [[architecture|the arch]] → custom display text
Wiki-links automatically append .md if the target has no extension.
Callouts
GitHub-style callouts render with icons and colored backgrounds:
> [!NOTE]
> Informational callout
> [!TIP]
> Helpful suggestion
> [!WARNING]
> Something to watch out for
> [!CAUTION]
> Dangerous action
> [!IMPORTANT]
> Critical information
Table of Contents
Pages with h2/h3 headers automatically get a sidebar table of contents with scroll spy. The ToC is hidden on screens narrower than 1100px.
Rendering Pipeline
- Extract tables → placeholders
- Extract code blocks → placeholders
- Convert lists (ul, ol, task lists)
- Convert blockquotes and callouts
- Apply inline formatting (bold, italic, code, links, wiki-links)
- Wrap in paragraphs, clean up
- Restore placeholders
- Generate heading IDs and ToC
- Wrap in full HTML page with styles