WizdomWeb/resources/views/partials/hero.php

41 lines
1.8 KiB
PHP

<?php
/**
* Hero Partial (v2)
*
* This partial dynamically loads a hero section based on the provided configuration.
* It allows pages to enable or disable the hero and define custom styles.
*
* ## Configuration Options:
* - `enabled` (bool) - Determines whether the hero is displayed (default: false)
* - `title` (string) - Hero title text
* - `description` (string) - Hero subtitle or description text
* - `image` (string) - Background image URL (default: 'wizdom-about-definitions.jpg')
* - `height` (string) - Height of the hero section (default: '50vh')
* - `text_align` (string) - Text alignment ('left', 'center', 'right') (default: 'center')
* - `overlay` (bool) - Apply a dark overlay to improve text readability (default: true)
*/
// Ensure hero visibility is explicitly enabled
if (!isset($heroConfig) || empty($heroConfig['enabled'])) {
return;
}
$heroTitle = htmlspecialchars($heroConfig['title'] ?? '', ENT_QUOTES, 'UTF-8');
$heroDescription = htmlspecialchars($heroConfig['description'] ?? '', ENT_QUOTES, 'UTF-8');
$heroImage = htmlspecialchars($heroConfig['image'] ?? '/assets/images/wizdom-about-definitions.jpg', ENT_QUOTES, 'UTF-8');
$heroHeight = htmlspecialchars($heroConfig['height'] ?? '50vh', ENT_QUOTES, 'UTF-8');
$textAlign = htmlspecialchars($heroConfig['text_align'] ?? 'center', ENT_QUOTES, 'UTF-8');
$overlay = $heroConfig['overlay'] ?? false;
?>
<section class="hero-section" style="background-image: url('<?php echo $heroImage; ?>'); height: <?php echo $heroHeight; ?>;">
<?php if ($overlay) : ?>
<div class="hero-overlay"></div>
<?php endif; ?>
<div class="hero-content" style="text-align: <?php echo $textAlign; ?>;">
<h1><?php echo $heroTitle; ?></h1>
<p><?php echo $heroDescription; ?></p>
</div>
</section>