- Agregado cierre de row después del card 1
- Agregado apertura de row para cards 2-4
- Corregida indentación de headers dentro de card-body
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Eliminado </div> duplicado en toggle Desktop
- Agregado cierre correcto para col-md-6 del primer card
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Row 1: Activación + Contenido (col-md-6 cada uno)
- Row 2: Estilos + Vista Previa (col-md-6 cada uno)
- Añadido h-100 para altura uniforme entre cards
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Eliminar row g-4 y col-md-4 que causaban layout horizontal
- Cambiar a divs con mb-4 para espaciado vertical consistente
- Último elemento con mb-0 para evitar espacio extra
- Los 3 toggles ahora se apilan verticalmente como cards
Issue: #144🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Mejoras implementadas:
- Header del tab con gradiente y botón de restaurar defaults
- Cards con sombras y bordes sutiles para las secciones
- Section titles con iconos destacados en gradiente naranja
- Toggle containers con fondo gris claro y bordes
- Input groups sin bordes intermedios (merge)
- Color pickers mejorados con preview de código hex
- Progress bar visual para contador de caracteres del mensaje
- Alert personalizado con tip de diseño
- Vista previa interactiva del Top Bar en tiempo real
- Badges para indicadores (Opcional, Requerido)
- Iconografía consistente con Bootstrap Icons
- Espaciado mejorado con sistema g-4
Diseño coherente con paleta APUs (Navy + Orange + Neutrales)
Issue: #144🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Actualizar main.php con diseño completo del Tab Top Bar
- Agregar switches en lugar de checkboxes básicos
- Implementar layout responsive con grid Bootstrap
- Agregar textarea con contador de caracteres para mensaje
- Implementar color pickers para estilos personalizados
- Mejorar accesibilidad con labels y roles ARIA
- Agregar vista previa informativa
Basado en: 05-IMPLEMENTACION-ADMIN-INTERFAZ-TOP-BAR.md
Issue: #144🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implementación completa del componente Top Bar con 15 campos configurables desde el admin panel, siguiendo el algoritmo universal v2.0.
## Cambios Realizados
### Backend (PHP)
- Agregados defaults del Top Bar a class-settings-manager.php
- Implementada validación completa en class-validator.php (15 campos)
- Implementada sanitización con sanitize_text_field, esc_url_raw y sanitize_hex_color
- Modificado header.php con código 100% configurable usando wp_parse_args()
### Frontend (Admin Panel)
- Creado tab HTML completo con 3 secciones: Activación, Contenido y Estilos
- Implementado JavaScript para renderizado y recolección de datos
- 15 campos configurables: enabled, visibility, icon, content, link, custom styles
### Infraestructura
- Creado admin-panel/init.php para carga del módulo
- Creada class-admin-menu.php con enqueue de Bootstrap 5 y assets
- Creada estructura base CSS y JavaScript del admin
- Ya cargado en functions.php línea 276
## Características
- Responsive: Control independiente mobile/desktop
- Estilos personalizables: 4 colores + tamaño de fuente
- Validación robusta: Límites de caracteres, URLs, colores hex
- Defaults inteligentes: Valores seguros si no hay configuración
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
