feat(equipa): o cartão de detalhe nasce da foto, estica e segue o rato
O cartão abre por cima da própria foto (mesmo sítio, tamanho e inclinação), endireita-se e estica para o lado — para a esquerda nas fotos da ponta direita — com o texto a entrar por trás. Aberto, inclina-se em 3D e desliza uns píxeis na direção do rato; ao sair volta a dobrar-se para dentro da foto. No telemóvel voa da foto para o centro (FLIP) e volta ao fechar. - clip-path em px calculados no JS: o Chrome não interpola inset() com calc(100% - …) e o recorte saltava em vez de esticar. - O cartão é posicionado sem transição antes de abrir; senão a transição do estado fechado arrancava primeiro e a abertura partia de valores antigos. - Tira o «Saber mais» do cartão da equipa. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
1614bf327b
commit
90ee2a93bc
3 files changed
+237
-84
No files matched your search
@@ -140,7 +140,6 @@ if ($team):
|
||||
<h4><?= htmlspecialchars((string) $d['name']) ?></h4>
|
||||
<?php if ($t_title !== ''): ?><p class="trainer-title"><?= htmlspecialchars($t_title) ?></p><?php endif; ?>
|
||||
<?php if ($t_detail): ?>
|
||||
<span class="trainer-more" aria-hidden="true">Saber mais <i class="fas fa-plus"></i></span>
|
||||
<div class="trainer-detail" id="<?= $t_id ?>">
|
||||
<button type="button" class="td-close" aria-label="Fechar">×</button>
|
||||
<div class="td-photo"><img loading="lazy" src="<?= $t_img ?>" alt=""></div>
|
||||
|
||||
Reference in new issue
Block a user