Actividad en vivo

Aprobado2026-10-02 · Aprobado por el founder en la revisión visual.

Lo que pasa en la empresa, estilo terminal, actualizándose solo sin recargar la página.

Vista · datos de ejemplo

Actividad En vivo

14:32:08Guías
14:10:51Contactos
13:47:02Sitio web
12:05:19Facturas

Ver toda la actividad

Anatomía

Etiqueta 'Actividad' y 'EN VIVO' con cuadrado que parpadea
Línea por evento: hora en Ubuntu Mono, qué pasó, área
El evento nuevo entra arriba, con la hora en naranja y el texto que se escribe

Sí

Eventos reales (empuje o sondeo con pausa si la pestaña está oculta)
Lenguaje de persona
6 líneas y 'Ver toda la actividad'

No muestres eventos técnicos ni ids
No recargues la página para actualizar

HTML exacto

<section class="nu-actividad nu-actividad--vivo" aria-label="Actividad" data-kit-vivo>
  <div class="nu-actividad__cabeza">
    <span class="nu-etiqueta nu-etiqueta--bloque">Actividad</span>
    <span class="nu-vivo">En vivo</span>
  </div>
  <ol class="nu-actividad__lista" aria-live="polite">
    <li class="nu-suceso"><span class="nu-suceso__cuando">14:32:08</span><button type="button" class="nu-suceso__texto">Kōdo preparó la guía GD-00064 para Juanito SpA</button><span class="nu-suceso__area">Guías</span></li>
    <li class="nu-suceso"><span class="nu-suceso__cuando">14:10:51</span><button type="button" class="nu-suceso__texto">Ana Pérez agregó el contacto Comercial Sur Ltda.</button><span class="nu-suceso__area">Contactos</span></li>
    <li class="nu-suceso"><span class="nu-suceso__cuando">13:47:02</span><button type="button" class="nu-suceso__texto">Se publicó la página Servicios del sitio web</button><span class="nu-suceso__area">Sitio web</span></li>
    <li class="nu-suceso"><span class="nu-suceso__cuando">12:05:19</span><button type="button" class="nu-suceso__texto">Factura 000269 emitida y enviada al cliente</button><span class="nu-suceso__area">Facturas</span></li>
  </ol>
  <div class="nu-actividad__mas"><a class="nu-enlace" href="/activity">Ver toda la actividad</a></div>
</section>

Clases: .nu-actividad .nu-actividad--vivo .nu-vivo .nu-suceso .nu-suceso--nuevo · Fragmento: snippets/live-activity.html