Toast de emisión en directo
La caja de luz roja de un estudio parpadea al encenderse mientras corre el tiempo de emisión y suben los espectadores.
Ajustes
Código
<div class="uvq09-air"><button type="button" class="fire">Volver a emitir</button><div class="tt" role="status"><span class="lt" aria-hidden="true"><span>EN DIRECTO</span></span><span class="tx"><b>Tu emisión ha empezado</b><small aria-hidden="true"><span class="tm">00:00</span> · <span class="vw">0</span> espectadores</small></span><button type="button" class="end">Finalizar</button></div></div>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Toasts
Ver todos: ToastsDónde usarlo
Todos los estudios tienen ese cartel rojo que dice que estás en directo, y este toast lo convierte en protagonista. La caja de luz empieza apagada, parpadea con una animación de filtro a saltos como una bombilla que se calienta y luego zumba con un brillo suave. Al lado, el tiempo y los espectadores cambian cada segundo en una línea oculta a los lectores de pantalla.
El color principal es la luz y el secundario el brillo cálido de las letras. Conecta el tiempo y los espectadores a datos reales y usa el botón Finalizar para cortar la emisión; la luz se apaga antes de que el toast se vaya. Pensado para streaming, webinars y venta en directo.