Implementation Plan: Página Sobre

Branch: 021-pagina-sobre | Date: 2026-04-17 | Spec: spec.md Input: Criar página estática /sobre com hero, história, diferenciais, métricas, equipe e CTA final.

Summary

Criar AboutPage.tsx — uma página 100% estática com seis seções institucionais — e integrá-la ao roteamento SPA via App.tsx. Adicionalmente, atualizar o link "Sobre" no Footer.tsx de #sobre para /sobre (navegação client-side via <Link>). Sem backend, sem chamadas a API, sem novo estado global.

Technical Context

Language/Version: TypeScript 5.5 / React 18
Primary Dependencies: react-router-dom v6 (já instalado), Tailwind CSS 3.4 (já configurado)
Storage: N/A — página 100% estática
Testing: N/A — componente puramente estático
Target Platform: SPA browser (desktop + mobile, 320 px → 1920 px)
Project Type: Web application — frontend SPA
Performance Goals: Tempo de renderização equivalente ao das demais páginas estáticas do site
Constraints: Layout responsivo sem overflow horizontal; sem chamadas a APIs; WhatsApp placeholder 5500000000000
Scale/Scope: 1 nova page, 2 arquivos editados

Constitution Check

GATE: Must pass before Phase 0 research. Re-check after Phase 1 design.

Princípio	Status	Observação
I. Design-First	✅ PASS	Todos os tokens do DESIGN.md são aplicados: `bg-canvas`, `bg-panel`, `text-text-primary/secondary/tertiary`, `border-white/[0.06]`, `rounded-2xl`, accent `#5e6ad2`. Nenhum inline style fora do sistema.
II. Separation of Concerns	✅ PASS	Feature 100% frontend. Sem nenhuma chamada ao backend Flask.
III. Spec-Driven Development	✅ PASS	`spec.md` aprovado; ciclo plan → tasks → implement respeitado.
IV. Data Integrity	✅ N/A	Sem dados de API, sem banco de dados. Todo conteúdo é estático.
V. Security	✅ PASS	Página pública, sem segredos, sem autenticação. Link WhatsApp usa `wa.me` com placeholder substituível.
VI. Simplicity First	✅ PASS	1 componente de page, sem abstração extra, sem helpers, sem contexto novo.

Resultado: Sem violações. Pode prosseguir para Phase 0.

Project Structure

Documentation (this feature)

specs/021-pagina-sobre/
├── plan.md              # Este arquivo
├── research.md          # Phase 0 output
├── data-model.md        # Phase 1 output
├── quickstart.md        # Phase 1 output
└── tasks.md             # Phase 2 output (/speckit.tasks — NÃO gerado aqui)

Source Code (repository root)

frontend/
└── src/
    ├── pages/
    │   └── AboutPage.tsx          ← NOVO
    ├── App.tsx                    ← EDITADO (nova rota /sobre)
    └── components/
        └── Footer.tsx             ← EDITADO (href #sobre → /sobre via <Link>)

Structure Decision: Web application — apenas camada frontend. Sem novos serviços, hooks, contextos ou tipos compartilhados. AboutPage.tsx segue exatamente o padrão de PrivacyPolicyPage.tsx.

Complexity Tracking

Nenhuma violação de Constitution detectada. Seção omitida conforme orientação do template.

3.2 KiB Raw Blame History