Elegir un framework de interfaz (none / Tailwind / Bootstrap)
Un único ajuste de configuración decide cómo se estiliza cada cuadrícula, formulario y botón de toda la instalación.
XcrudConfig::$ui
Toda decisión visual que toma xCRUD Nova Pro - clases de botones, bordes de tabla, estructura de los modales, estilo de los controles de formulario - está gobernada por un único interruptor de cadena en src/Config.php:
public static string $ui = 'tailwind';| Valor | Descripción |
|---|---|
'none' | Tema integrado "de libro de contabilidad", sin dependencias - su propio CSS escrito a mano usando propiedades personalizadas (--xcrud-pine, --xcrud-radius y similares), sin ninguna petición a CDN. |
'tailwind' | Carga la compilación CDN de Tailwind junto con Google Fonts (Inter para el texto de la interfaz, JetBrains Mono para monoespaciado/código). Este es el valor por defecto. |
'bootstrap' | Clases y componentes con estilo Bootstrap, cargados desde CDN. |
Es global, no por página
A diferencia de la mayoría de los ajustes de Xcrud, $ui no tiene una anulación por widget - no existe una llamada ->ui('bootstrap') en la clase Xcrud. Cada página, cada widget, cada ayudante consciente del tema (Xcrud::uiAssets(), los globales JS de window.Xcrud) lee el mismo valor válido para toda la instalación. Cambiarlo restyliza toda la aplicación de una sola vez, que es precisamente el objetivo - una instalación con temas mezclados supondría enviar varias copias del CSS/JS de CDN a la misma página sin ningún beneficio.
Cómo se estructura un tema
Cada valor de $ui corresponde a una carpeta bajo themes/{ui}/:
| Archivo | Propósito |
|---|---|
theme.js | Un mapa de cadenas de clases que el widget del lado del cliente lee al construirse - se registra en window.XcrudThemes[ui], y debe cargarse antes que el propio core/xcrud.js. |
assets.php (opcional) | Todo lo adicional que el tema necesita en <head> - etiquetas <script>/<link> de CDN, enlaces de Google Fonts, configuración del framework. Un tema sin nada adicional (como 'none', que solo necesita su propio xcrud.css) puede prescindir por completo de este archivo. |
Ambos archivos son emitidos automáticamente por render() en una página de widget normal. Una página sin widget que aun así quiere los recursos del tema (un botón personalizado, un toast independiente) llama directamente a Xcrud::uiAssets() - consulta Frontends desacoplados y CORS para ese patrón.
<script src="themes/<?= XcrudConfig::$ui ?>/theme.js"></script>
<?= Xcrud::uiAssets() ?>Cómo elegir
Elige 'none' para una instalación sin dependencias (no requiere acceso a ningún CDN, la carga más liviana), 'tailwind' si tu propio sitio ya se apoya en clases de utilidad o quieres el aspecto por defecto sin ninguna configuración, y 'bootstrap' si el resto de tu aplicación ya está basado en Bootstrap y quieres que las pantallas CRUD combinen visualmente con ella.