feat(home): preencher hero fotográfico

This commit is contained in:
2026-08-11 10:30:19 -03:00
parent d2d1b436fa
commit f7fdf3930c
5 changed files with 176 additions and 43 deletions

View File

@@ -7,7 +7,7 @@ Dar à fotografia do hero da home a mesma presença contínua da referência apr
## Escopo
- Alterar somente o componente `resources/views/components/home/hero.blade.php` e seus testes diretos.
- Quando `hero_image_path` existir, usar uma grade externa `0.9fr / 1.1fr` a partir de `md` (768px), com altura exata `calc(100dvh - 5.5rem)`: o espaço restante depois do header desktop. A mídia deve chegar ao topo e à base da seção, sem padding vertical ou lateral de container.
- Quando `hero_image_path` existir, usar uma grade externa `0.9fr / 1.1fr` a partir de `md` (768px), com altura exata `calc(100dvh - 5rem)`: o espaço restante depois do header desktop. A mídia deve chegar ao topo e à base da seção, sem padding vertical ou lateral de container.
- Manter o texto, CTAs, imagem CMS, `alt`, carregamento eager, `fetchpriority`, responsividade de imagem e atributos de motion existentes.
- Abaixo de `md`, manter a ordem texto seguido de imagem, sem overflow horizontal, e fixar a mídia em `aspect-ratio: 4 / 5` com `object-cover`.
- Quando não houver imagem configurada, manter a abertura tonal, tipográfica e contida já existente, sem área vazia para mídia.
@@ -23,7 +23,7 @@ O componente continuará sendo a única unidade de layout do hero. A variante co
## Critérios de aceitação
- Em desktop, `data-split-hero` inicia sob o header e mede `calc(100dvh - 5.5rem)`, sem margens externas de container.
- Em desktop, `data-split-hero` inicia sob o header e mede `calc(100dvh - 5rem)`, sem margens externas de container.
- A foto usa `object-cover`, `loading="eager"`, `fetchpriority="high"`, path/alt próprios do hero e `sizes="(max-width: 767px) 100vw, 55vw"`.
- Em mobile, o conteúdo essencial continua acessível antes da foto, sem overflow nem texto recortado.
- O fallback sem foto continua com `data-tonal-hero`, sem `data-split-hero` e sem mídia renderizada.