ahmido/TenantAtlas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity
85d93135e3
TenantAtlas/specs/214-website-visual-foundation/quickstart.md
ahmido f884b16061
Some checks failed
Main Confidence / confidence (push) Failing after 40s
Details
feat: implement website visual foundation (#251) 
## Summary
- implement the website-only visual foundation for apps/website
- formalize semantic tokens, typography, spacing, surfaces, and shared CTA/navigation primitives
- align landing, trust/legal, and content-heavy routes plus Playwright smoke coverage with the new foundation

## Validation
- corepack pnpm build:website
- corepack pnpm --filter @tenantatlas/website exec playwright test

## Scope
- website-only change set for spec 214
- no apps/platform runtime coupling introduced

Co-authored-by: Ahmed Darrazi <ahmed.darrazi@live.de>
Reviewed-on: #251
2026-04-19 07:19:58 +00:00

2.6 KiB
Raw Blame History

Quickstart: Website Visual Foundation

Purpose

This quickstart describes the local workflow for implementing the website-only visual foundation in apps/website.

Prerequisites

  • Node 20+ available through the repo workspace tooling
  • Corepack-enabled pnpm
  • Repo root at wt-website

Local Development

Start the website from the repo root:

corepack pnpm dev:website

The website must continue to honor the existing WEBSITE_PORT contract.

Expected Implementation Order

Implement the feature in this order:

  1. Audit the current token and foundation layer in apps/website/src/styles/tokens.css and apps/website/src/styles/global.css.
  2. Formalize semantic token roles for color, typography, spacing, surfaces, radius, borders, and shadows.
  3. Update the current Astro primitives so shared rules are enforced through component APIs rather than page-local class decisions.
  4. Apply the foundation across representative page families: landing/product, trust/legal, and content-heavy routes.
  5. Encode shadcn/ui usage constraints through local primitives and implementation review rules, without introducing a new required React runtime.
  6. Re-run build and smoke validation.

Working Constraints

The implementation must preserve all existing website working-contract guarantees:

  • keep @tenantatlas/website unchanged
  • keep WEBSITE_PORT unchanged
  • keep root dev:website and build:website workflows working
  • keep all changes local to apps/website unless a deliberate new contract is explicitly introduced
  • do not introduce platform runtime coupling, shared auth, or shared DTO/API assumptions

Required Validation

Run the website build proof from the repo root:

corepack pnpm build:website

Run the browser smoke suite from the website app:

cd apps/website
corepack pnpm exec playwright test

What Reviewers Should Verify

Reviewers should confirm that:

  • representative landing, trust/legal, and content-heavy routes still load correctly
  • heading hierarchy, section rhythm, and CTA weight are visibly consistent across those page families
  • navigation and footer links remain reachable
  • focus states and mobile readability remain intact
  • no uncontrolled local override bypasses the shared token and primitive model
  • no React, Radix, or platform coupling is introduced without a separate explicit decision

Out of Scope for This Feature

  • Filament theming or apps/platform styling
  • shared website-platform design system work
  • API-backed contact handling or a website backend
  • CMS introduction
  • visual regression infrastructure beyond the current lightweight smoke path