Saltar a contenido

Configuración: Temas (Motor 2.0)

Propósito

Controlar la estética y la experiencia de usuario (UX) tanto en el panel de administración como en las vistas públicas (tiendas, portal de clientes) mediante el Motor de Temas 2.0.

Capacidades del Motor 2.0

  • Paletas de color: Definir Color Primario, Secundario, Peligro, Éxito y Advertencia.
  • Estilo de Layout: Elegir entre bordes rectos o redondeados (border-radius variables).
  • Glassmorphism: Activación de fondos translúcidos con efecto desenfoque (backdrop-blur) en modales, cabeceras y menús flotantes.
  • Modos de Color: Soporte estricto para Modo Claro (Light Theme neutro profesional) o Modo Oscuro (Studio Pro dark theme).
  • Tipografía: Selector de fuente principal (ej. Inter, Roboto).

Flujo de actualización

  1. Acceder a Configuración > Temas.
  2. Elegir el entorno (Staff UI o Portal Público).
  3. Modificar la variable visual (ej. cambiar el color primario de azul a verde).
  4. Al guardar, las variables CSS se regeneran globalmente e inyectan en tiempo real sin requerir recargar la página gracias al binding de Alpine.js.