Qumo/qumo-website
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
qumo-website/openspec/changes/archive/2026-04-10-step-002-base-layout/proposal.md
Luigi Maiorano 089dbaa606 step 002 complete
2026-04-10 18:41:58 +02:00

2.2 KiB
Raw Permalink Blame History

Why

Step 001 established brand tokens and fonts — we now have a working Astro project but every page must manually construct its own <html> document with head meta tags. Step 002 creates the shared BaseLayout.astro shell so all subsequent pages start from a consistent, SEO-complete foundation without repetition.

What Changes

  • New: src/layouts/BaseLayout.astro — HTML document shell accepting props for title, description, locale, canonical URL, alternate URL, OG image, and JSON-LD structured data
  • New: src/components/Nav.astro — empty stub (filled in step 003)
  • New: src/components/Footer.astro — empty stub (filled in a later step)
  • New: src/content/en.json — initial structure with global meta fields (site name, default title, default description, default OG image path)
  • New: src/content/nl.json — Dutch translations of the same global meta fields
  • New: src/content/i18n.ts — helper that loads and returns the correct JSON content object based on locale string
  • Update: src/pages/index.astro — replace manual <html> shell with <BaseLayout>, passing appropriate props

Capabilities

New Capabilities

  • base-layout: HTML document shell providing consistent <head> (charset, viewport, favicon, Archia font preloads, canonical link, hreflang alternates, OG tags, Twitter card tags) and <body> defaults (Midnight background, Snow text, Archia font), with stub nav/footer and content/JSON-LD slots
  • content-i18n: File-based content loading system — JSON files per locale (en.json, nl.json) plus an i18n.ts helper function that returns the correct content object given a locale string

Modified Capabilities

  • brand-tokens: No requirement changes — the existing spec covers colors, fonts, and gradient; BaseLayout consumes these tokens but does not change them

Impact

  • All future pages (/, /about, /ai-launchpad, /contact, /privacy, plus /nl/* variants) will import and use BaseLayout
  • SEO: adds canonical URL, hreflang (en ↔ nl), OG tags, and Twitter card tags to every page
  • Affects en.json / nl.json content structure (introduces the meta key)
  • No new npm dependencies — uses only Astro built-ins and TypeScript
Reference in New Issue View Git Blame Copy Permalink