Skip to content

Apply CorvidLabs design system to the docs#287

Closed
0xLeif wants to merge 1 commit into
mainfrom
brand/theme-docs
Closed

Apply CorvidLabs design system to the docs#287
0xLeif wants to merge 1 commit into
mainfrom
brand/theme-docs

Conversation

@0xLeif

@0xLeif 0xLeif commented Jun 12, 2026

Copy link
Copy Markdown
Contributor

Summary

Themes the spec-sync docs site to the CorvidLabs design-system standard. The site was off-brand (no design tokens, no light/dark, sky-blue accent). This vendors the brand standard and rebuilds the docs (11 pages) + examples (3) + shared chrome on it. The marketing landing and language gallery are being moved to the corvidlabs-site hub, so they were left untouched beyond the shared header/footer.

  • Vendored the standard into site/public/brand/ via sync-to.sh (design-system v1.1.0): tokens.css, theme.js, theme-toggle.html, crow marks, favicon.svg.
  • Tokens: tokens.css loaded globally; the site's legacy variable layer (--bg, --text, --accent, --drift…) is aliased onto brand tokens, so every existing component themes for free in light + dark. Square corners, no purple.
  • Fonts: Schibsted Grotesk (display/body) + Spline Sans Mono (code) via Google Fonts.
  • Light + dark: prefers-color-scheme with the standard sun/moon toggle in the header, pre-paint snippet for no-flash, ?theme= override for QA. Never a "THEME" text button.
  • Logo: crow head mark inlined with currentColor in the header; favicon → /brand/favicon.svg.
  • Syntax: switched Shiki to the css-variables theme and mapped --astro-code-token-* onto the brand --code-* palette, so all .spec.md/YAML/CLI code blocks follow light/dark and stay on-brand (teal keywords, green strings, amber numbers, muted comments — no blue/purple defaults).
  • A11y/polish: prefers-reduced-motion guards on all transitions/animations, focus-visible rings on the sheen accent, WCAG AA in both modes, responsive (mobile keeps the toggle, hides GitHub/Install).

Test Plan

  • bun run build passes (34 pages)
  • bun run lint (astro check): 0 errors / 0 warnings / 0 hints
  • Screenshotted docs home, CLI reference, spec-format, and an examples page in both light and dark at 1440 and 500 — verified by reading each:
    • Docs home (light/dark, 1440 + mobile): warm paper / dark surfaces, crow mark, sun/moon toggle, on-brand Quick Start code block. ✓
    • CLI reference (light/dark, 1440 + mobile): command badges + provider table + code all on-brand, no purple. ✓
    • Spec format (dark): YAML/spec syntax on the brand palette. ✓
    • Examples / CI gate (light, 1440 + mobile): article layout, teal eyebrow, diff-style code blocks. ✓
    • Mobile: hamburger + theme toggle both present, Contents toggle, horizontal code scroll. ✓

Needs review

  • Marketing landing (index.astro) + language gallery (LanguageCard, languages/[slug]) still carry the old amber #fbbf24 accent on SpecCodeDiff/language tags. Intentionally left for the hub migration — flagging so it isn't mistaken for a miss.

🤖 Generated with Claude Code

Vendor the brand standard (tokens.css, theme.js, theme-toggle, crow
marks, favicon) into site/public/brand and build the docs + examples +
shared chrome on it:

- Import brand tokens.css globally; alias the site's legacy variable
  layer onto the brand tokens so every component themes for free in
  light + dark. Square corners, no purple.
- Schibsted Grotesk + Spline Sans Mono via Google Fonts.
- Standard sun/moon theme toggle in the header (prefers-color-scheme +
  pre-paint, no flash); crow head mark inline (currentColor);
  favicon -> /brand/favicon.svg.
- Switch Shiki to the css-variables theme and map --astro-code-token-*
  onto the brand --code-* syntax palette so spec/code blocks follow
  light/dark and stay on-brand.
- prefers-reduced-motion guards, focus-visible, AA contrast both modes.

Marketing landing + language gallery (moving to the hub) left untouched.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@0xLeif 0xLeif requested a review from a team as a code owner June 12, 2026 22:00
@0xLeif 0xLeif requested review from 0xGaspar, Kyntrin and tofu-ux June 12, 2026 22:00
@gemini-code-assist

Copy link
Copy Markdown

Warning

You have reached your daily quota limit. Please wait up to 24 hours and I will start processing your requests again!

@github-actions github-actions Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✅ Corvin says...

      _
    <(^\  .oO(Caw! ^v^)
     |/(\
      \(\\
      " "\\

"Caw! Found a shiny new spec!"

CI Summary

Check Status
Validate action.yml ✅ Passed
Dependency Audit ✅ Passed
Code Coverage ✅ Passed
Format Check ✅ Passed
Docs Site ✅ Passed
Spec Validation ✅ Passed
Tests (build, test, clippy) ✅ Passed
VS Code Extension ✅ Passed
📋 Spec Validation Details

✅ SpecSync: Passed

Metric Value
Specs checked 58
Passed 58
Errors 0
Warnings 0
File coverage 100% (74/74)
LOC coverage 100% (33727/33727)

Generated by specsync · Run specsync check --format github to reproduce


Powered by corvid-pet

@0xLeif

0xLeif commented Jun 12, 2026

Copy link
Copy Markdown
Contributor Author

Superseded by the single-site consolidation: docs are migrating into corvidlabs-site (the only site updated going forward); this site will be redirected/retired. Closing per the new strategy.

@0xLeif 0xLeif closed this Jun 12, 2026
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