* Fix ASCII diagram rendering: use system mono font for box-drawing chars
Geist Mono renders box-drawing characters (┌─┐│└┘) at double width,
breaking alignment in the concepts page diagram. Use system monospace
fonts (Menlo, Monaco, Consolas) for ascii-variant code blocks, which
handle these characters at correct single width.
* Fix CSS specificity: code element was overriding pre font-family
.docs-content code sets font-family to Geist Mono, which overrides
the system mono font set on the parent pre element. Geist Mono is
loaded with Latin subset only, lacking box-drawing glyphs (U+2500-257F),
so browsers fall back to CJK-aware fonts that render them double-width.
Fix: add font-family: inherit to .docs-content pre code so code
elements inside pre blocks inherit the correct font from their parent.
* Add "Read the Docs" link below bottom CTA on homepage
* Increase top padding on Read the Docs link
* Reduce docs horizontal padding on mobile
* Align docs content with header on mobile, increase top padding
* Make sticky header fully opaque with subtle bottom border
* Fix sticky header on mobile by containing horizontal overflow in content area
Wide content (hierarchy diagrams, code blocks) was causing horizontal
page scroll, which breaks position:sticky on mobile browsers. Added
overflow-x:hidden to the main content area (below the header in DOM)
and overflow-x:auto to docs pre blocks so they scroll internally.
* Remove bottom border from sticky header
- Fix community section gap (6px → 16px)
- Add dingyi tweet showing cmux went semi-viral in China
- Change "semi-viral in Japan" to "viral in Japan" + "semi-viral in China"
## Summary
- Add Community (testimonials) section to homepage with inline avatars
- Add FAQ section sourced from HN discussion questions
- Add hero screenshot with next/image optimization
- Add Show HN blog post with react-tweet embeds, star history chart, and HN quotes
- Redesign footer with 4-column grid layout (Product, Resources, Legal, Social)
- Add Download/GitHub CTA buttons at bottom of homepage and blog post
- Add dev spacing controls for features, FAQ, and community sections
- Fix hydration error (JSON-LD moved to head)
- SEO: full metadata on blog posts, robots.txt, blog pages in sitemap, canonical URLs
- Replace em dashes site-wide, fix notification descriptions
## Testing
- `bun tsc --noEmit` passes clean
- Dev server verified on port 3001
## Related
- Task: Add wall of love to main web page + landing screenshot
- Delete docs-site/ (superseded by web/app/docs)
- Add posthog-js with Vercel reverse proxy at /cdata to bypass adblockers
- Track pageviews (SPA-aware), download clicks (hero/navbar/mobile_drawer),
and GitHub link clicks (hero/navbar/mobile_drawer/footer)
Bump navbar, docs, legal, and community layouts from max-w-5xl to
max-w-6xl. Widen docs content from max-w-2xl to max-w-3xl. Home and
blog pages unchanged. Disable next-themes transition on change.
Next.js App Router serves app/icon.png (32x32 favicon) at /icon.png,
shadowing the 256x256 public/icon.png. Rename to /logo.png so the
high-res image is served for the site logo.
- Overlay covers entire viewport (inset-0 z-40) including header
- Drawer at z-50 spans full height with its own header row
- Duplicate theme toggle + close (X) button inside drawer
- Docs sidebar/FAB bumped to z-50 to stay above overlay
- Move overlay and drawer nav outside <header> to avoid iOS Safari
backdrop-filter breaking fixed positioning
- Overlay starts below header (top-12) instead of covering full screen
so header stays clean when drawer is open
- Add invisible class when drawer closed as fallback
- Remove auto-focus on first link to prevent focus ring flash
ThemeToggle was fixed-positioned over the hamburger menu on mobile.
Move it into SiteHeader so both controls sit together. Add
whitespace-nowrap to hero Download/GitHub buttons and flex-wrap
to their container so they don't break across lines on narrow screens.
Extract drawer logic (overlay, focus trap, scroll lock, escape key)
from DocsNav into shared mobile-drawer.tsx hook and components.
SiteHeader now shows a hamburger menu on mobile that opens a
right-side drawer with nav links and download button. Footer
wraps gracefully on small screens.
