47 lines
2.1 KiB
PHP
47 lines
2.1 KiB
PHP
@props([
|
||
'slides' => [],
|
||
'variant' => 'compact', // 'main' | 'compact'
|
||
'id' => 'hero'
|
||
])
|
||
|
||
@if(!empty($slides))
|
||
<section class="hero-slider hero-slider--{{ $variant }}" id="{{ $id }}" aria-label="프로모션 배너">
|
||
<div class="hero-track">
|
||
@foreach($slides as $s)
|
||
@php
|
||
$img = $s['image'] ?? null;
|
||
$imgDefault = is_array($img) ? ($img['default'] ?? null) : $img;
|
||
$imgMobile = is_array($img) ? ($img['mobile'] ?? null) : null;
|
||
$bgPos = $s['bg_pos'] ?? 'center';
|
||
$style = '';
|
||
if ($imgDefault) $style .= "--hero-bg:url('{$imgDefault}');";
|
||
if ($imgMobile) $style .= "--hero-bg-mobile:url('{$imgMobile}');";
|
||
if ($bgPos) $style .= "--hero-bg-pos:{$bgPos};";
|
||
@endphp
|
||
|
||
<div class="hero-slide" style="{{ $style }}">
|
||
<div class="hero-content">
|
||
@if(!empty($s['kicker'])) <div class="hero-kicker">{{ $s['kicker'] }}</div> @endif
|
||
<h2 class="hero-title">{{ $s['title'] }}</h2>
|
||
@if(!empty($s['desc'])) <p class="hero-desc">{{ $s['desc'] }}</p> @endif
|
||
|
||
@if(!empty($s['cta_label']) && !empty($s['cta_url']))
|
||
<a href="{{ $s['cta_url'] }}" class="btn btn-primary hero-cta">{{ $s['cta_label'] }}</a>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
@endforeach
|
||
</div>
|
||
|
||
@if(count($slides) > 1)
|
||
<button class="slider-arrow prev" aria-label="이전 배너">‹</button>
|
||
<button class="slider-arrow next" aria-label="다음 배너">›</button>
|
||
<div class="dots-container" aria-label="배너 선택">
|
||
@foreach($slides as $idx => $s)
|
||
<button class="dot {{ $idx===0?'active':'' }}" data-index="{{ $idx }}" aria-label="배너 {{ $idx+1 }}"></button>
|
||
@endforeach
|
||
</div>
|
||
@endif
|
||
</section>
|
||
@endif
|