fix(Gallery): boxer images flickering when updating gallery

[AlejandroSuero]

Descripción

Como se menciona en #918, al hacer la actualización de imágenes en Gallery.astro se utiliza View Transitions API lo cual genera que las imágenes que tienen una transición actúen.

Problema solucionado

Fixes #918

la-velada-web-oficial/src/components/Boxers/Gallery.astro

Lines 188 to 196 in 873a47f

	if ($lightbox.open && document.startViewTransition) {
	document.startViewTransition(() => {
	updateImg(link)
	})
	return
	} else {
	updateImg(link)
	}

Cambios propuestos

1. Eliminar la transición usando View Transitions API

- if ($lightbox.open && document.startViewTransition) {
-   document.startViewTransition(() => {
-     updateImg(link)
-   })
-  return
- } else {
+ if ($lightbox.open) {
    updateImg(link)
  }

Capturas de pantalla (si corresponde)

Antes:

Gallery-image-flickering.mp4

Note

En #918 se explica más en detalle el parpadeo en cuestión.

Después:

Gallery-fixed-flickering.mp4

Comprobación de cambios

• He revisado que no haya ninguna PR (pull request) ya abierta con un problema similar, siguiendo el apartado de buenas prácticas
• He revisado localmente los cambios para asegurarme de que no haya errores ni problemas.
• He probado estos cambios en múltiples dispositivos y navegadores para asegurarme de que la landing page se vea y funcione correctamente.
• He actualizado la documentación, si corresponde.

Impacto potencial

Mejorar la experiencia de usuario

Contexto adicional

Si se quiere mantener la animación que se creaba con View Transitions API o generar una nueva, se podría añadir una animación CSS y comprobar cuando se empieza y termina con TypeScript dando así soporte a los navegadores sin View Transitions API.

Enlaces útiles

• Documentación del proyecto:
• Código de referencia:

[vercel]

@AlejandroSuero is attempting to deploy a commit to the midudev pro Team on Vercel.

A member of the Team first needs to authorize it.