WizdomWeb/resources/views/partials/hero.php

58 lines
2.8 KiB
PHP

<?php
/**
* Hero Partial (v2) - Refactored to Remove Inline Styles
*
* This partial dynamically loads hero section configurations and writes styles to a page-specific CSS file (`<pageid>.css`).
*
* ## Configuration Options:
* - `id` (string) - Unique identifier for the hero section.
* - `background_image` (string) - URL for the background image.
* - `height` (string) - Height of the hero section (default: '65vh').
* - `overlay_opacity` (float) - Opacity of the background overlay (default: 0.5).
* - `content_width` (string) - Maximum width of the hero content (default: '60%').
* - `text_align` (string) - Alignment of the hero text (default: 'center').
*/
// Ensure hero visibility is explicitly enabled
if (!isset($heroConfig) || empty($heroConfig['background_image'])) {
error_log("[ERROR] Missing or invalid hero configuration.");
return;
}
$heroId = htmlspecialchars($heroConfig['id'] ?? 'default', ENT_QUOTES, 'UTF-8');
$pageCssFile = "/assets/css/" . htmlspecialchars($pageId, ENT_QUOTES, 'UTF-8') . ".css";
$cssFilePath = $_SERVER['DOCUMENT_ROOT'] . $pageCssFile;
$heroHeight = $heroConfig['height'] ?? '65vh';
$overlayOpacity = $heroConfig['overlay_opacity'] ?? 0.5;
$contentWidth = htmlspecialchars($heroConfig['content_width'] ?? '60%', ENT_QUOTES, 'UTF-8');
$textAlign = htmlspecialchars($heroConfig['text_align'] ?? 'center', ENT_QUOTES, 'UTF-8');
$cssContent = "/* Auto-generated styles for {$pageId} hero section */\n";
$cssContent .= "#hero-{$heroId} {\n";
$cssContent .= " background-image: url('" . htmlspecialchars($heroConfig['background_image'], ENT_QUOTES, 'UTF-8') . "');\n";
$cssContent .= " height: {$heroHeight};\n";
$cssContent .= " background-size: cover;\n";
$cssContent .= " background-position: center;\n";
$cssContent .= "}\n";
$cssContent .= "#hero-{$heroId} .hero-overlay {\n background: rgba(0, 0, 0, {$overlayOpacity});\n}\n";
$cssContent .= "#hero-{$heroId} .hero-content {\n max-width: {$contentWidth};\n text-align: {$textAlign};\n}\n";
if (!file_exists($cssFilePath) || file_get_contents($cssFilePath) !== $cssContent) {
file_put_contents($cssFilePath, $cssContent);
}
?>
<section id="hero-<?php echo $heroId; ?>" class="hero-section">
<div class="hero-overlay"></div>
<div class="hero-content">
<h1><?php echo htmlspecialchars($heroConfig['title'], ENT_QUOTES, 'UTF-8'); ?></h1>
<p><?php echo htmlspecialchars($heroConfig['description'], ENT_QUOTES, 'UTF-8'); ?></p>
<?php if (!empty($heroConfig['cta_text']) && !empty($heroConfig['cta_link'])) : ?>
<a href="<?php echo htmlspecialchars($heroConfig['cta_link'], ENT_QUOTES, 'UTF-8'); ?>" class="btn btn-primary">
<?php echo htmlspecialchars($heroConfig['cta_text'], ENT_QUOTES, 'UTF-8'); ?>
</a>
<?php endif; ?>
</div>
</section>