perf: Agregar min-height a Hero Section para reducir CLS

- Leer campos min_height, title_min_height, badge_min_height del schema
- Aplicar min-height a .hero-section (120px)
- Aplicar min-height a .hero-section__title (3rem)
- Aplicar min-height a .hero-section__badge (32px)

Fase 1 del plan de optimización PageSpeed (99-pagespeed-optimization-plan.md)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
FrankZamora
2025-11-27 11:56:08 -06:00
parent 8f4e854a20
commit 90ac8a16cc

View File

@@ -104,6 +104,9 @@ final class HeroRenderer implements RendererInterface
$marginBottom = $spacing['margin_bottom'] ?? '1.5rem'; $marginBottom = $spacing['margin_bottom'] ?? '1.5rem';
$badgePadding = $spacing['badge_padding'] ?? '0.375rem 0.875rem'; $badgePadding = $spacing['badge_padding'] ?? '0.375rem 0.875rem';
$badgeBorderRadius = $spacing['badge_border_radius'] ?? '20px'; $badgeBorderRadius = $spacing['badge_border_radius'] ?? '20px';
$minHeight = $spacing['min_height'] ?? '120px';
$titleMinHeight = $spacing['title_min_height'] ?? '3rem';
$badgeMinHeight = $spacing['badge_min_height'] ?? '32px';
$boxShadow = $effects['box_shadow'] ?? '0 4px 16px rgba(30, 58, 95, 0.25)'; $boxShadow = $effects['box_shadow'] ?? '0 4px 16px rgba(30, 58, 95, 0.25)';
$titleTextShadow = $effects['title_text_shadow'] ?? '1px 1px 2px rgba(0, 0, 0, 0.2)'; $titleTextShadow = $effects['title_text_shadow'] ?? '1px 1px 2px rgba(0, 0, 0, 0.2)';
@@ -119,6 +122,7 @@ final class HeroRenderer implements RendererInterface
'box-shadow' => $boxShadow, 'box-shadow' => $boxShadow,
'padding' => "{$paddingVertical} 0", 'padding' => "{$paddingVertical} 0",
'margin-bottom' => $marginBottom, 'margin-bottom' => $marginBottom,
'min-height' => $minHeight,
]); ]);
$cssRules[] = $this->cssGenerator->generate('.hero-section__title', [ $cssRules[] = $this->cssGenerator->generate('.hero-section__title', [
@@ -129,6 +133,7 @@ final class HeroRenderer implements RendererInterface
'text-shadow' => $titleTextShadow, 'text-shadow' => $titleTextShadow,
'margin-bottom' => '0', 'margin-bottom' => '0',
'text-align' => 'center', 'text-align' => 'center',
'min-height' => $titleMinHeight,
]); ]);
$cssRules[] = $this->cssGenerator->generate('.hero-section__badge', [ $cssRules[] = $this->cssGenerator->generate('.hero-section__badge', [
@@ -144,6 +149,7 @@ final class HeroRenderer implements RendererInterface
'text-decoration' => 'none', 'text-decoration' => 'none',
'display' => 'inline-block', 'display' => 'inline-block',
'transition' => 'all 0.3s ease', 'transition' => 'all 0.3s ease',
'min-height' => $badgeMinHeight,
]); ]);
$cssRules[] = $this->cssGenerator->generate('.hero-section__badge:hover', [ $cssRules[] = $this->cssGenerator->generate('.hero-section__badge:hover', [