Skip to content

feat(web): rewrite essays in Brian's voice + fix sticky/scroll/breakpoint UX#114

Merged
blove merged 2 commits into
mainfrom
claude/condescending-moore-7988a2
May 11, 2026
Merged

feat(web): rewrite essays in Brian's voice + fix sticky/scroll/breakpoint UX#114
blove merged 2 commits into
mainfrom
claude/condescending-moore-7988a2

Conversation

@blove
Copy link
Copy Markdown
Contributor

@blove blove commented May 11, 2026

Summary

Two changes bundled.

1. Three essays rewritten in Brian's voice

Voice-analysis subagent read recent posts on brianflove.com (agentic-memory, frontend-reward-loop, A2UI, etc.) and produced a style brief. A second subagent rewrote the three launch posts mechanically to that brief.

What changed in the prose:

  • Cold, claim-first openings followed by a "Not because X" / "It is not Y" two-beat reframe
  • One-line "That is X." emphasis beats throughout
  • A `## tl;dr` block of lowercase fragment bullets near the top of each post
  • Two-beat synthesis closers ("X is Y. And Y is Z. That is what makes this interesting.")
  • Bolded one-liners as pull-quote claims, italics for terminology
  • Lean toward "do not" / "it is" instead of contractions

Opening sentences (voice check):

  • Why we built Dawn: "Agent codebases are becoming one of the harder shapes in TypeScript right now."
  • App Router for AI Agents: "The Next.js App Router did something subtle and important."
  • Dawn 0.4 — Deep Agents preview: "Sub-agents are becoming one of the more important boundaries in agentic software."

2. Docs/blog scroll behavior + breakpoint fixes

Found via a Chrome-MCP UX diagnostics subagent:

  • --header-h CSS var (4.5rem) in globals.css, plus `html { scroll-padding-top: var(--header-h) }`. Anchor-link jumps from the TOC now land below the header instead of flush to the top.
  • ReadingLayout sticky offsets switched from hardcoded `top-16 / h-[calc(100vh-4rem)]` to `var(--header-h)`, so the sticky sidebars don't snap 8-9px high under the actual header height.
  • DocsTOC breakpoint aligned to its container aside (`lg:block` instead of `xl:block`). Previously the right aside appeared with its border-l from 1024-1279px while the TOC inside stayed hidden — an empty bordered rail. Now content and rail reveal together.
  • CreamSurface min-h-screen dropped (`h-full` instead). The outer wrapper already provides `min-h-screen` via `flex flex-col`; the redundant min-height was forcing extra blank space below the footer on short pages.
  • PostMeta avatar normalized to 28px to match PostHeader's mobile byline. Same image, same size across desktop/mobile boundary.

Test plan

  • Visit /docs/getting-started at 1440px and scroll — sidebars stay below header, no 8-9px high-snap
  • Click any TOC entry — heading lands below header, not flush
  • Resize from 1280 → 1100 → 900 — right TOC rail appears/disappears with its content, no empty bordered column
  • Visit /blog/why-we-built-dawn at 375px — voice is right, avatar visible, tag chip below
  • pnpm vitest run, typecheck, lint all green

blove and others added 2 commits May 11, 2026 16:27
- Introduce --header-h CSS var (4.5rem) and html scroll-padding-top
  so anchor jumps land below the header instead of flush to the top.
- ReadingLayout: switch sticky asides from hardcoded top-16/h-4rem
  to var(--header-h) so the sidebars don't snap 8-9px high under
  the actual header height.
- DocsTOC: align nav breakpoint with ReadingLayout's right-aside
  reveal (lg:block instead of xl:block). Previously the aside
  appeared with its border-l from 1024-1279px but the TOC inside
  stayed hidden until 1280px, producing an empty bordered rail.
- CreamSurface: drop redundant min-h-screen (main.flex-1 already
  provides full-height) and use h-full for the inverse to keep
  parity. Prevents short pages from forcing extra blank space
  below the footer.
- PostMeta avatar normalized to 28px to match PostHeader's mobile
  byline, so the same image isn't sized differently across the
  desktop/mobile boundary.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Apply Brian's voice guide to the three launch posts (origin essay, mental-model
essay, 0.4 release). Short declarative sentences, cold claim-first openings,
tl;dr bullet blocks, one-line "That is X." emphasis beats, and stakes-landing
closers. Preserved frontmatter and intra-site links; reused existing code
blocks (without-Dawn / with-Dawn comparison, route tree, createSubAgent).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@vercel
Copy link
Copy Markdown

vercel Bot commented May 11, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
dawnai Ready Ready Preview, Comment May 11, 2026 11:35pm

Request Review

@blove blove merged commit deb3d11 into main May 11, 2026
4 checks passed
@blove blove deleted the claude/condescending-moore-7988a2 branch May 11, 2026 23:40
blove added a commit that referenced this pull request May 14, 2026
…oint UX (#114)

* fix(web): docs/blog scroll behavior + breakpoint alignment

- Introduce --header-h CSS var (4.5rem) and html scroll-padding-top
  so anchor jumps land below the header instead of flush to the top.
- ReadingLayout: switch sticky asides from hardcoded top-16/h-4rem
  to var(--header-h) so the sidebars don't snap 8-9px high under
  the actual header height.
- DocsTOC: align nav breakpoint with ReadingLayout's right-aside
  reveal (lg:block instead of xl:block). Previously the aside
  appeared with its border-l from 1024-1279px but the TOC inside
  stayed hidden until 1280px, producing an empty bordered rail.
- CreamSurface: drop redundant min-h-screen (main.flex-1 already
  provides full-height) and use h-full for the inverse to keep
  parity. Prevents short pages from forcing extra blank space
  below the footer.
- PostMeta avatar normalized to 28px to match PostHeader's mobile
  byline, so the same image isn't sized differently across the
  desktop/mobile boundary.


* content(blog): rewrite three launch posts in Brian's voice

Apply Brian's voice guide to the three launch posts (origin essay, mental-model
essay, 0.4 release). Short declarative sentences, cold claim-first openings,
tl;dr bullet blocks, one-line "That is X." emphasis beats, and stakes-landing
closers. Preserved frontmatter and intra-site links; reused existing code
blocks (without-Dawn / with-Dawn comparison, route tree, createSubAgent).


---------
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant