style(headers): improve header spacing

[66HEX]

Summary by CodeRabbit

• Style
  • Improved documentation page heading spacing.
  • Added consistent top spacing for H1 and H2 headings.
  • Removed excess spacing before the first H2 heading.

[coderabbitai]

📝 Walkthrough

Walkthrough

Documentation heading spacing now uses explicit H1 and H2 margins. The article layout removes the margin from the first H2 heading.

Changes

Documentation heading spacing

Layer / File(s)	Summary
Heading spacing rules apps/web/src/lib/components/docs/markdown/H1.svelte, apps/web/src/lib/components/docs/markdown/H2.svelte, apps/web/src/lib/components/docs/MarkdownLayout.svelte	H1 uses mt-16. H2 uses mt-12. The first article H2 uses zero top margin.

Estimated code review effort: 1 (Trivial) | ~2 minutes

Mergeability Score: 🔵 Low · up to e58fc

The header-spacing change does not consistently remove the extra top spacing from the first H2 when an article begins with other content. This is a bounded documentation-only visual issue, so the PR is mergeable with explicit owner follow-up.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly summarizes the main change: improving spacing for documentation headers.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch style/docs

---

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@apps/web/src/lib/components/docs/MarkdownLayout.svelte`:
- Line 38: Update the MarkdownLayout container’s Tailwind selector from
[&>h2:first-child] to target the first direct h2 element by type, ensuring the
first heading receives mt-0 even when preceding content such as a paragraph
exists.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: a954c0cb-a8e4-4076-96fc-c4758b6971c2

📥 Commits

Reviewing files that changed from the base of the PR and between a338092 and e58fced.

📒 Files selected for processing (3)

• apps/web/src/lib/components/docs/MarkdownLayout.svelte
• apps/web/src/lib/components/docs/markdown/H1.svelte
• apps/web/src/lib/components/docs/markdown/H2.svelte

[coderabbitai]

🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Target the first H2, not only the first child.

h2:first-child matches only when the article starts with an H2. The rendered /docs article has a paragraph before its first H2, so that heading keeps mt-12 instead of receiving the intended exception. Use h2:first-of-type here. (motion-gpu.dev)

Proposed selector fix

- class="w-full max-w-4xl space-y-6 text-base leading-relaxed text-foreground [&>h2:first-child]:mt-0"
+ class="w-full max-w-4xl space-y-6 text-base leading-relaxed text-foreground [&>h2:first-of-type]:mt-0"

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	class="w-full max-w-4xl space-y-6 text-base leading-relaxed text-foreground [&>h2:first-child]:mt-0"
	class="w-full max-w-4xl space-y-6 text-base leading-relaxed text-foreground [&>h2:first-of-type]:mt-0"

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/web/src/lib/components/docs/MarkdownLayout.svelte` at line 38, Update
the MarkdownLayout container’s Tailwind selector from [&>h2:first-child] to
target the first direct h2 element by type, ensuring the first heading receives
mt-0 even when preceding content such as a paragraph exists.