fix: page horizontal scroll from resolution 768px to 1023px

[dresandev]

Descripción

Se cambió la forma de gestionar el background en forma de paralelogramo.

Problema solucionado

Scroll horizontal en la página desde la resolución 768px hasta 1023px. #450 complementando la PR #458

Cambios propuestos

En lugar de manejar directamente el efecto de paralelogramo del fondo en el contenedor padre con la clase de Tailwind -skew-x-6, se gestiona mediante el pseudoelemento ::before del padre. A este pseudoelemento se le aplican los estilos del fondo y se utiliza la propiedad clip-path para lograr el efecto de paralelogramo. La clase -skew-x-6 se aplica a los hijos que lo requieran. De esta manera, se evita que el contenedor se salga de los límites de la página al ser sesgado usando la clase -skew-x-6.

Capturas de pantalla

antes:

despues:

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.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
la-velada-web-oficial	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Mar 12, 2024 8:05pm