Referencia de estilos de banners y tercios inferiores

Esta referencia documenta todos los tipos de banner y los estilos de animación de tercios inferiores (Animated Caption).

Banner básico con dos campos de texto.

Propiedad	Descripción
Primary Text (texto principal)	Título principal (máx. 54 caracteres)
Secondary Text (texto secundario)	Subtítulo/descripción (máx. 200 caracteres)
Ticker	Desactivado

Banner de texto desplazable para anuncios.

Propiedad	Descripción
Primary Text	Título principal (máx. 54 caracteres)
Secondary Text	Contenido desplazable (máx. 1000 caracteres)
Ticker	Activado
Direction (dirección)	Dirección de la animación

Direcciones del ticker:

ltr: de izquierda a derecha
rtl: de derecha a izquierda

{
  idx: string,           // Identificador único
  title: string,         // Texto principal
  text: string,          // Texto secundario
  ticker: boolean,       // Es modo ticker
  direction: string,     // 'ltr' o 'rtl'
  order: number,         // Orden de visualización
}

Estilos de animación de tercios inferiores (Animated Captions)

La galería de estilos de Animated Caption

15 estilos de animación disponibles para tercios inferiores/rótulos de nombre.

Estilos estándar (ra_dc_1 a ra_dc_8)

ID	Nombre del estilo	Descripción
`ra_dc_1`	Classic Bar	Barra de color con logo, nombre y cargo
`ra_dc_2`	Two Line	Nombre arriba, cargo debajo
`ra_dc_3`	Minimal	Diseño limpio de dos líneas
`ra_dc_4`	Single Line + Bar	Nombre con barra de acento
`ra_dc_5`	Decorative	Varias líneas de acento
`ra_dc_6`	Bold	Diseño prominente
`ra_dc_7`	Modern	Diseño contemporáneo
`ra_dc_8`	Professional	Estilo empresarial

Variantes verticales (ra_dc_9_v a ra_dc_11_v)

ID	Nombre del estilo	Descripción
`ra_dc_9_v`	Vertical 1	Diseño pensado para vertical
`ra_dc_10_v`	Vertical 2	Alternativa vertical
`ra_dc_11_v`	Vertical 3	Vertical compacto

Estilos adicionales

ID	Nombre del estilo	Descripción
`ra_dc_12`	Extended	Diseño de ancho completo
`ra_dc_14`	Stylized	Diseño de acento único
`ra_dc_15`	Contemporary	Moderno y minimalista

Configuración del tercio inferior

Orígenes de posición (tOrigin)

Valor	Posición
`t_origin_tl`	Arriba a la izquierda
`t_origin_tc`	Arriba al centro
`t_origin_tr`	Arriba a la derecha
`t_origin_bl`	Abajo a la izquierda
`t_origin_bc`	Abajo al centro
`t_origin_br`	Abajo a la derecha

Orígenes de transformación CSS

tOriginList: {
  't_origin_tl': 'left top',
  't_origin_tc': 'center top',
  't_origin_tr': 'right top',
  't_origin_bl': 'left bottom',
  't_origin_bc': 'center bottom',
  't_origin_br': 'right bottom',
}

Ajustes de color

Propiedad	Descripción
`color`	Color de acento principal (barras, líneas)
`color2`	Color del texto

Ajustes del logo

Propiedad	Descripción
`uselogo`	Booleano: muestra u oculta el logo
`logo`	URL de la imagen del logo

Estructura de datos del tercio inferior

{
  animationType: string,    // De 'ra_dc_1' a 'ra_dc_15'
  tOrigin: string,          // Origen de posición
  color: string,            // Color principal (hex)
  color2: string,           // Color del texto (hex)
  uselogo: boolean,         // Mostrar logo
  logo: string,             // URL del logo
}

Estados de animación

Aparecer/desaparecer

Los tercios inferiores se animan al entrar y salir mediante clases CSS:

.appear: animación de entrada activa
.disappear: animación de salida activa

Transiciones de escena

.scene_transition_not_finished: durante el cambio de escena
.banner_or_comment_is_shown: cuando está activo

Límites de caracteres

Campo	Estándar	Ticker
Primary Text	54	54
Secondary Text	200	1000

Colores de validación

Normal: color de texto predeterminado
Advertencia: #fc6d72 (rojo) al superar el límite

Elementos de la interfaz

Elemento	Etiqueta
Campo de título	Placeholder “Primary Text”
Campo de texto	Placeholder “Secondary Text”
Contador de caracteres	“Characters X/54”
Casilla de ticker	“Ticker (Scrolling text)”
Selector de dirección	“Animation direction”
Botón de crear	“Create”
Botón de limpiar	“Clear”

Botón del panel de banners

Estado	Etiqueta
Cerrado	“Create Banner” (con ícono +)
Abierto	“Close”

Referencia de estilos de banners y tercios inferiores

Tipos de banner

Banner estándar

Banner ticker

Estructura de datos del banner