ak-markdown-novel-viewer

name	ak:markdown-novel-viewer
description	View markdown files in a calm, book-like reader served via HTTP. Use for long-form content review — RFCs, runbooks, design docs, reports, specs, novels — anywhere you want a distraction-free reading mode in the browser.
user-invocable	true
when_to_use	Invoke to read long markdown comfortably in the browser.
category	utilities
keywords	["markdown","viewer","reading","preview"]
argument-hint	[file-or-directory]
metadata	{"author":"agentkit","version":"1.0.0"}

markdown-novel-viewer

Background HTTP server rendering markdown files with calm, book-like reading experience.

Note: HTML generation mode (/ak:preview --html ...) produces self-contained HTML files that open directly in the browser — they do not use this server.

⚠️ Installation Required

This skill requires npm dependencies. Run one of the following:

# Install from this skill directory
npm install

Dependencies: marked, highlight.js, gray-matter

Without installation, you'll get Error 500: Error rendering markdown.

Purpose

Universal viewer - pass ANY path and view it:

• Markdown files → novel-reader UI with serif fonts, warm theme
• Directories → file listing browser with clickable links

Quick Start

# View a markdown file
node scripts/server.cjs \
  --file ./plans/my-plan/plan.md \
  --open

# Browse a directory
node scripts/server.cjs \
  --dir ./plans \
  --host 0.0.0.0 \
  --open

# Background mode
node scripts/server.cjs \
  --file ./README.md \
  --background

# Stop all running servers
node scripts/server.cjs --stop

Skill Invocation

Use /ak:preview for quick access:

/ak:preview plans/my-plan/plan.md    # View markdown file
/ak:preview plans/                   # Browse directory
/ak:preview --stop                   # Stop server

Features

Novel Theme

• Warm cream background (light mode)
• Dark mode with warm gold accents
• Libre Baskerville serif headings
• Inter body text, JetBrains Mono code
• Maximum 720px content width

Mermaid.js Diagrams

• Auto-renders mermaid code blocks as diagrams
• Theme-aware (light/dark mode support)
• Full-width toggle: Click diagram to expand/collapse
• Error display with source preview for debugging