# Tasks: Initial Website Foundation & v0 Product Site **Input**: Design documents from `/specs/213-website-foundation-v0/` **Prerequisites**: `plan.md`, `spec.md`, `research.md`, `data-model.md`, `quickstart.md`, `contracts/public-site.openapi.yaml` **Tests**: Browser smoke coverage is required for this runtime-changing website feature, together with the root website build proof. ## Test Governance Checklist - [X] Lane assignment is named and is the narrowest sufficient proof for the changed behavior. - [X] New or changed tests stay in the smallest honest family, and the browser addition remains explicit. - [X] Shared helpers and context defaults stay cheap by default; no backend, auth, or fixture-heavy setup is introduced. - [X] Planned validation commands cover the website change without pulling in unrelated platform lane cost. - [X] Any runtime-cost or escalation note stays documented in this feature rather than being deferred implicitly. ## Phase 1: Setup (Shared Infrastructure) **Purpose**: Establish the minimal website tooling and config baseline required before reusable UI work begins. - [X] T001 Add explicit website TypeScript configuration in `apps/website/tsconfig.json` - [X] T002 [P] Add Tailwind CSS v4 and Playwright dev dependencies plus website test scripts in `apps/website/package.json` - [X] T003 [P] Update Astro aliases and website-safe build configuration in `apps/website/astro.config.mjs` --- ## Phase 2: Foundational (Blocking Prerequisites) **Purpose**: Create the shared shell, primitives, tokens, metadata, and smoke-test harness that every page depends on. **⚠️ CRITICAL**: No user story work should begin until this phase is complete. - [X] T004 Configure Tailwind v4 theme tokens and base website styles in `apps/website/src/styles/global.css` and `apps/website/src/styles/tokens.css` - [X] T005 [P] Create shared site metadata, navigation, and footer configuration in `apps/website/src/lib/site.ts` and `apps/website/src/types/site.ts` - [X] T006 [P] Add the browser smoke-test harness in `apps/website/playwright.config.ts` and `apps/website/tests/smoke/smoke-helpers.ts` - [X] T007 Build the base document and page shell wrappers in `apps/website/src/layouts/BaseLayout.astro` and `apps/website/src/components/layout/PageShell.astro` - [X] T008 [P] Build global navigation and footer components in `apps/website/src/components/layout/Navbar.astro` and `apps/website/src/components/layout/Footer.astro` - [X] T009 [P] Implement layout primitives in `apps/website/src/components/primitives/Container.astro`, `apps/website/src/components/primitives/Section.astro`, `apps/website/src/components/primitives/SectionHeader.astro`, `apps/website/src/components/primitives/Stack.astro`, `apps/website/src/components/primitives/Cluster.astro`, and `apps/website/src/components/primitives/Grid.astro` - [X] T010 [P] Implement shared UI primitives in `apps/website/src/components/primitives/Button.astro`, `apps/website/src/components/primitives/Badge.astro`, `apps/website/src/components/primitives/Card.astro`, `apps/website/src/components/primitives/Input.astro`, and `apps/website/src/components/primitives/Textarea.astro` - [X] T011 Build reusable section scaffolds in `apps/website/src/components/sections/PageHero.astro`, `apps/website/src/components/sections/CTASection.astro`, `apps/website/src/components/sections/FeatureGrid.astro`, `apps/website/src/components/sections/TrustGrid.astro`, and `apps/website/src/components/sections/LogoStrip.astro` **Checkpoint**: Foundation ready. User-story page work can now begin. --- ## Phase 3: User Story 1 - Understand the Product Quickly (Priority: P1) 🎯 MVP **Goal**: Deliver the first credible public explanation of TenantAtlas through Home and Product. **Independent Test**: Visit Home and Product, verify both routes render from the shared shell, and confirm the smoke suite proves product-category clarity and next-step CTA reachability without platform coupling. ### Tests for User Story 1 > **NOTE**: Write this test first and confirm it fails before implementing the story. - [X] T012 [P] [US1] Write failing smoke coverage for Home and Product in `apps/website/tests/smoke/home-product.spec.ts` ### Implementation for User Story 1 - [X] T013 [P] [US1] Create Home and Product content modules in `apps/website/src/content/pages/home.ts` and `apps/website/src/content/pages/product.ts` - [X] T014 [P] [US1] Create product-explanation content primitives in `apps/website/src/components/content/Eyebrow.astro`, `apps/website/src/components/content/Headline.astro`, `apps/website/src/components/content/Lead.astro`, and `apps/website/src/components/content/FeatureItem.astro` - [X] T015 [P] [US1] Create supporting proof blocks in `apps/website/src/components/content/Callout.astro` and `apps/website/src/components/content/Metric.astro` - [X] T016 [US1] Implement the Home and Product routes in `apps/website/src/pages/index.astro` and `apps/website/src/pages/product.astro` **Checkpoint**: Home and Product are independently functional and demonstrable as the MVP slice. --- ## Phase 4: User Story 2 - Evaluate Fit by Audience (Priority: P2) **Goal**: Add audience-fit, trust framing, and ecosystem-fit pages that help visitors judge whether TenantAtlas fits their environment. **Independent Test**: Visit Solutions, Security & Trust, and Integrations from the shared navigation and verify the smoke suite proves audience-specific framing, substantiated trust messaging, and non-speculative integrations. ### Tests for User Story 2 > **NOTE**: Write this test first and confirm it fails before implementing the story. - [X] T017 [P] [US2] Write failing smoke coverage for Solutions, Security & Trust, and Integrations in `apps/website/tests/smoke/solutions-trust-integrations.spec.ts` ### Implementation for User Story 2 - [X] T018 [P] [US2] Create Solutions, Security & Trust, and Integrations content modules in `apps/website/src/content/pages/solutions.ts`, `apps/website/src/content/pages/security-trust.ts`, and `apps/website/src/content/pages/integrations.ts` - [X] T019 [P] [US2] Create audience and trust content primitives in `apps/website/src/components/content/AudienceRow.astro`, `apps/website/src/components/content/TrustPrincipleCard.astro`, and `apps/website/src/components/content/IntegrationBadge.astro` - [X] T020 [P] [US2] Implement the Solutions route in `apps/website/src/pages/solutions.astro` - [X] T021 [P] [US2] Implement the Security & Trust route in `apps/website/src/pages/security-trust.astro` - [X] T022 [P] [US2] Implement the Integrations route in `apps/website/src/pages/integrations.astro` **Checkpoint**: Audience fit, trust framing, and integration fit are independently functional and testable. --- ## Phase 5: User Story 3 - Reach a Qualified Next Step (Priority: P3) **Goal**: Deliver the contact/demo path, legal surfaces, and cross-page CTA/legal reachability needed for a trustworthy conversion flow. **Independent Test**: Visit Contact, Legal, Privacy, and Terms and confirm the smoke suite proves CTA reachability and footer/legal access from every published core page. ### Tests for User Story 3 > **NOTE**: Write this test first and confirm it fails before implementing the story. - [X] T023 [P] [US3] Write failing smoke coverage for Contact, Legal, Privacy, Terms, footer links, CTA reachability, and legal-surface availability in `apps/website/tests/smoke/contact-legal.spec.ts` ### Implementation for User Story 3 - [X] T024 [P] [US3] Create Contact and legal content modules, including any required jurisdiction-specific public legal notice content, in `apps/website/src/content/pages/contact.ts`, `apps/website/src/content/pages/legal.ts`, `apps/website/src/content/pages/privacy.ts`, and `apps/website/src/content/pages/terms.ts` - [X] T025 [P] [US3] Create conversion and legal content primitives in `apps/website/src/components/content/PrimaryCTA.astro`, `apps/website/src/components/content/SecondaryCTA.astro`, `apps/website/src/components/content/ContactPanel.astro`, `apps/website/src/components/content/DemoPrompt.astro`, and `apps/website/src/components/content/RichText.astro` - [X] T026 [P] [US3] Implement the Contact route in `apps/website/src/pages/contact.astro` - [X] T027 [P] [US3] Implement the Legal hub route, including any required jurisdiction-specific public legal notice path, in `apps/website/src/pages/legal.astro` - [X] T028 [P] [US3] Implement the Privacy and Terms routes in `apps/website/src/pages/privacy.astro` and `apps/website/src/pages/terms.astro` - [X] T029 [US3] Add SEO and future-ready content scaffolding, including explicit sitemap output, in `apps/website/src/lib/seo.ts`, `apps/website/src/content.config.ts`, `apps/website/public/robots.txt`, `apps/website/src/pages/sitemap.xml.ts`, and `apps/website/astro.config.mjs` - [X] T030 [US3] Wire final CTA and footer/legal reachability across `apps/website/src/pages/index.astro`, `apps/website/src/pages/product.astro`, `apps/website/src/pages/solutions.astro`, `apps/website/src/pages/security-trust.astro`, `apps/website/src/pages/integrations.astro`, and `apps/website/src/pages/contact.astro` **Checkpoint**: The qualified contact path and legal reachability are functional across the full published site. --- ## Phase 6: Polish & Cross-Cutting Concerns **Purpose**: Final validation, wording review, and workspace-contract verification across all stories. - [X] T031 [P] Validate both required fast-feedback proof commands against `apps/website/package.json`, `apps/website/playwright.config.ts`, and `specs/213-website-foundation-v0/quickstart.md` - [X] T032 [P] Review and tighten public wording against substantiated-claim and banned-wording rules in `apps/website/src/content/pages/home.ts`, `apps/website/src/content/pages/product.ts`, `apps/website/src/content/pages/solutions.ts`, `apps/website/src/content/pages/security-trust.ts`, `apps/website/src/content/pages/integrations.ts`, `apps/website/src/content/pages/contact.ts`, `apps/website/src/content/pages/legal.ts`, `apps/website/src/content/pages/privacy.ts`, and `apps/website/src/content/pages/terms.ts` - [X] T033 Verify the workspace script and package contracts remain intact in `package.json` and `apps/website/package.json` --- ## Dependencies & Execution Order ### Phase Dependencies - **Setup (Phase 1)**: Starts immediately. - **Foundational (Phase 2)**: Depends on Setup and blocks all story work. - **User Story 1 (Phase 3)**: Depends on Foundational only. - **User Story 2 (Phase 4)**: Depends on Foundational only. - **User Story 3 (Phase 5)**: Depends on Foundational and needs the core routes from US1 and US2 in place to satisfy “from any core page” CTA/legal reachability. - **Polish (Phase 6)**: Depends on all targeted stories being complete. ### User Story Dependencies - **US1**: No dependency on other user stories; this is the MVP slice. - **US2**: No dependency on US1 for implementation, but it reuses the same shared shell and primitives from Foundational. - **US3**: Depends on the published route set from US1 and US2 to complete the full cross-page CTA/legal contract. ### Within Each User Story - Write the browser smoke test first and verify it fails. - Create content modules and story-specific primitives before assembling the route files. - Finish route implementation before cross-page or SEO wiring tasks. --- ## Parallel Opportunities - `T002` and `T003` can run in parallel once `T001` is scoped. - `T005`, `T006`, `T008`, `T009`, and `T010` can run in parallel after `T004` begins. - In US1, `T013`, `T014`, and `T015` can run in parallel before `T016`. - In US2, `T018`, `T019`, `T020`, `T021`, and `T022` can be split across contributors once shared story inputs are clear. - In US3, `T024`, `T025`, `T026`, `T027`, and `T028` can run in parallel before `T029` and `T030`. - `T031` and `T032` can run in parallel during final polish. --- ## Parallel Example: User Story 2 ```bash # Launch the audience/trust/integration building blocks together: Task: "T018 [US2] Create Solutions, Security & Trust, and Integrations content modules" Task: "T019 [US2] Create audience and trust content primitives" # Then split the route assembly work: Task: "T020 [US2] Implement the Solutions route" Task: "T021 [US2] Implement the Security & Trust route" Task: "T022 [US2] Implement the Integrations route" ``` --- ## Implementation Strategy ### MVP First 1. Complete Phase 1: Setup. 2. Complete Phase 2: Foundational. 3. Complete Phase 3: User Story 1. 4. Run the website build and the US1 smoke test. 5. Demo the MVP with Home + Product. ### Incremental Delivery 1. Setup + Foundational establish the reusable website system. 2. US1 ships the first clear product explanation. 3. US2 expands into audience fit, trust, and integration context. 4. US3 completes the conversion/legal path and SEO/discovery scaffolding. 5. Polish validates wording, scripts, and proof commands before merge. ### Suggested MVP Scope - Deliver through **User Story 1** if a smaller first release is needed. - Add **User Story 2** next for evaluation depth. - Finish with **User Story 3** for full contact/legal/SEO readiness.