diff --git a/Assets/css/css-tablas-apu.css b/Assets/css/css-tablas-apu.css index 592fc2b4..e430c41c 100644 --- a/Assets/css/css-tablas-apu.css +++ b/Assets/css/css-tablas-apu.css @@ -28,6 +28,10 @@ border-radius: 8px; border: none; border-spacing: 0; + /* CRITICO: table-layout fixed previene CLS + El navegador calcula anchos basado en primera fila, + no recalcula cuando carga más contenido */ + table-layout: fixed; } /* Eliminar todos los bordes */ diff --git a/Inc/enqueue-scripts.php b/Inc/enqueue-scripts.php index ab7cddd6..ca1cfaed 100644 --- a/Inc/enqueue-scripts.php +++ b/Inc/enqueue-scripts.php @@ -562,17 +562,18 @@ add_action('wp_enqueue_scripts', 'roi_enqueue_theme_styles', 13); */ function roi_enqueue_apu_tables_styles() { // APU Tables CSS - // DIFERIDO: Fase 4.2 PageSpeed - below the fold + // CRITICO: Las tablas APU son contenido principal, CSS debe cargar inmediatamente + // para prevenir CLS (layout shift cuando estilos se aplican tarde) wp_enqueue_style( 'roi-tables-apu', get_template_directory_uri() . '/Assets/css/css-tablas-apu.css', array('roi-bootstrap'), ROI_VERSION, - 'print' // Diferido para no bloquear renderizado + 'all' // Critico: cargar inmediatamente para prevenir CLS ); } -add_action('wp_enqueue_scripts', 'roi_enqueue_apu_tables_styles', 15); +add_action('wp_enqueue_scripts', 'roi_enqueue_apu_tables_styles', 5); // Priority 5 = temprano /** * Enqueue APU Tables auto-class JavaScript diff --git a/Public/Hero/Infrastructure/Ui/HeroRenderer.php b/Public/Hero/Infrastructure/Ui/HeroRenderer.php index dd22803f..04389b3d 100644 --- a/Public/Hero/Infrastructure/Ui/HeroRenderer.php +++ b/Public/Hero/Infrastructure/Ui/HeroRenderer.php @@ -161,6 +161,11 @@ final class HeroRenderer implements RendererInterface 'min-height' => $titleMinHeight, ]); + // Contenedor de badges - altura minima para prevenir CLS + $cssRules[] = $this->cssGenerator->generate('.hero-section .mb-3.d-flex', [ + 'min-height' => '40px', + ]); + $cssRules[] = $this->cssGenerator->generate('.hero-section__badge', [ 'background' => $this->hexToRgba($badgeBgColor, 0.15), 'backdrop-filter' => "blur({$badgeBackdropBlur})",