¿Cómo mostrar un video en el modal de inicio de sesión de moda?

Soporte
1

@meghna ¡Gracias por este componente!
Funciona como se esperaba en el escritorio, pero
el video (canal de YouTube) no aparece en dispositivos móviles (navegadores Chrome, Edge) en iPhone XR (al menos).
¿Alguna idea de cómo solucionar esto?
¡Gracias!
P.D. En la captura de pantalla, el espacio en blanco encima del botón de inicio de sesión debería pertenecer al video…

IMG_2966.PNG
IMG_2966.PNG828×1792 117 KB

1 me gusta
2

Solucionado incrustando vídeo de YouTube cambiando un poco el HTML.
Añadir CSS ayudó a tener el vídeo en el móvil.

2 Me gusta
3

¿Puedes compartir tu truco aquí?

2 Me gusta
4

@tobiaseigen ¡seguro!
HTML dentro del componente en mi caso (presta atención a “EMBED” en el enlace de YouTube):

<p>Únete exclusivamente a StarCohort, recorriendo el Camino EuroTiger de UA, en sincronía global 🌍. Escala a continuación.</p>
<p class="center-aligned-element">
    <iframe width="560" height="315" src="https://www.youtube.com/embed/QKLAKLp7bDw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</p>

CSS (pegar dentro del Componente), en mi caso:

.video-container {
    position: relative;
    padding-bottom: 56.25%; /* Relación de aspecto 16:9 */
    padding-top: 30px; /* Algo de relleno en la parte superior para evitar superposición de contenido */
    height: 0;
    overflow: hidden;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

¡Espero que esto ayude a alguien!)

3 Me gusta