Alvo do port: no mobile de 390px, o drawer do estúdio ocupa toda a viewport, respeitando a
safe-area. O aviso abre a área rolável e sai de cena ao descer; nada fica sobre a prévia.
Zoom e setas continuam no mesmo fluxo. O shell do dialog desktop mantém sua geometria.
390px · alvo do port1280px · conferência de escopoConteúdo da prévia · NEEDS ASSET
Cena 01 · mobile 390 × 844
Altura total · aviso no fluxo, prévia e controles
Alvo do port
Time de você
Confira seu card
O recorte já foi centralizado. Se precisar, arraste a foto ou use os controles.
Prévia real do visitante · NEEDS ASSET
Ajuste fino
Harmonizar coresAjusta o brilho e as cores da sua foto para combinar com as fotos do
card.
O topo branco coincide com a viewport e reserva a safe-area. A área rolável começa no
aviso; imagem, zoom e setas vêm em seguida, sem qualquer camada sobre a prévia.
Cena 02 · mobile 390 × 844 · conteúdo rolado
Aviso fora de cena · nada sobre a prévia
Time de você
Confira seu card
Prévia real do visitante · NEEDS ASSET
Zoom
Ajuste fino
Cena 03 · desktop 1280 × 800
Dialog desktop · aviso no fluxo, imagem limpa
Sem mudança no shell desktop
Time de você
Confira seu card
O recorte já foi centralizado. Se precisar, arraste a foto ou use os controles.
Prévia real do visitante · NEEDS ASSET
Zoom
Ajuste fino
Dialog 512px · 92dvh
O dialog permanece centralizado, com largura e teto atuais. A nova regra vale no conteúdo
compartilhado: aviso dentro do fluxo rolável e nenhuma camada sobre a imagem.
Contrato visual para o port
• Mobile: drawer encosta no topo, cobre os 844px e respeita a safe-area.
• O aviso é o primeiro item da área rolável, acima da prévia.
• Ao descer, o aviso rola para fora; prévia, zoom e quatro setas ficam juntos.
• Nada se sobrepõe à imagem em drawer ou dialog.
• O badge “Arraste para ajustar” sai; gesto, zoom e setas permanecem.
• Desktop mantém dialog centralizado e dimensões atuais.