Evandro Fonseca Junior
b791b7de9e
Hero: replace particle field with cobe globe (Capricorn view, multi-axis drag, reduced-motion safe), telemetry HUD with pointer parallax, particle text build effect, Space Grotesk display font. SEO: short titles with template, PT-BR accents, twitter cards on dynamic cases, escaped JSON-LD via lib/jsonld.ts, CSP report-only, 25 service FAQs answer-first. Design: fix TW4 layered reset killing spacing utilities, literal @theme tokens, mobile hero overflow, header overlap, empty case cards. Remove framer-motion (unified on motion/react), header version badge, phone number from hero CTA. Production build verified (24 static pages).
71 lines
2.1 KiB
Markdown
71 lines
2.1 KiB
Markdown
# Plano: frontend foundation e conversão
|
|
|
|
## Estado inicial
|
|
|
|
- Branch atual: `feature/portrait-cyber-effects`.
|
|
- Workspace limpo antes da implementação.
|
|
- `pnpm run build` era o baseline verde conhecido.
|
|
- Testes e Biome já possuíam falhas preexistentes; a validação distinguirá regressões dos problemas anteriores.
|
|
|
|
## Execução
|
|
|
|
### 1. Regressões primeiro
|
|
|
|
Arquivos:
|
|
|
|
- `app/components/Header.test.tsx`
|
|
- `app/components/Hero.test.tsx`
|
|
- `app/components/cinematic/MagneticButton.test.tsx`
|
|
|
|
Adicionar asserções para:
|
|
|
|
- links e atributos ARIA do header;
|
|
- download do CV em `/Profile.pdf`;
|
|
- `li` renderizado diretamente sob uma lista.
|
|
|
|
Verificação: rodar as suítes específicas e observar falhas antes da implementação.
|
|
|
|
### 2. Contratos compartilhados
|
|
|
|
Arquivo novo:
|
|
|
|
- `lib/site-navigation.ts`
|
|
|
|
Exportar `CV_URL` e os itens de navegação usados pelo header. O teste do Hero e o componente devem usar o mesmo contrato.
|
|
|
|
### 3. Navegação global
|
|
|
|
Arquivos:
|
|
|
|
- `app/layout.tsx`
|
|
- `app/components/Header.tsx`
|
|
- `app/components/cinematic/CinematicOverlays.tsx`
|
|
|
|
Adicionar header no layout, skip link, navegação desktop, disclosure mobile e remover o botão Home redundante dos overlays.
|
|
|
|
### 4. Correções de semântica e performance
|
|
|
|
Arquivos:
|
|
|
|
- `app/components/Hero.tsx`
|
|
- `app/components/cinematic/MagneticButton.tsx`
|
|
- `app/components/cinematic/FilmGrain.tsx`
|
|
- `app/globals.css`
|
|
|
|
Usar `CV_URL`, renderizar `li` sem wrapper inválido, respeitar `prefers-reduced-motion`/pointer coarse no grain e adicionar foco/scroll global.
|
|
|
|
### 5. Validação e revisão
|
|
|
|
Executar:
|
|
|
|
```bash
|
|
pnpm exec jest --runInBand app/components/Header.test.tsx app/components/Hero.test.tsx app/components/cinematic/MagneticButton.test.tsx
|
|
pnpm run test -- --runInBand
|
|
pnpm run lint
|
|
pnpm run build
|
|
pnpm run format
|
|
pnpm exec biome check --write app/components/Header.tsx app/components/Hero.tsx app/components/cinematic/MagneticButton.tsx app/components/cinematic/CinematicOverlays.tsx app/components/cinematic/FilmGrain.tsx app/layout.tsx lib/site-navigation.ts
|
|
```
|
|
|
|
Revisar `git diff --check`, `git diff --stat` e o diff completo. Não criar commit sem solicitação explícita.
|