52 lines
3.1 KiB
PHP
52 lines
3.1 KiB
PHP
<section class="section-padding bg-muted/20">
|
|
<div class="container-padding">
|
|
{{-- Section Title --}}
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-section-title">{{ $content['title'] }}</h2>
|
|
<p class="text-large text-muted-foreground mt-4 max-w-2xl mx-auto">
|
|
{{ $content['subtitle'] }}
|
|
</p>
|
|
</div>
|
|
|
|
{{-- Spotlights Grid --}}
|
|
<div class="grid md:grid-cols-3 gap-8 lg:gap-12">
|
|
@foreach ($content['spotlights'] as $index => $spotlight)
|
|
<div class="text-center space-y-6 group">
|
|
<div
|
|
class="mx-auto w-20 h-20 bg-secondary/10 rounded-2xl flex items-center justify-center group-hover:bg-secondary/20 transition-colors duration-300">
|
|
@if ($spotlight['icon'] === 'map-pin')
|
|
<svg class="w-10 h-10 text-secondary" fill="none" stroke="currentColor"
|
|
viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z">
|
|
</path>
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path>
|
|
</svg>
|
|
@elseif($spotlight['icon'] === 'star')
|
|
<svg class="w-10 h-10 text-secondary" fill="none" stroke="currentColor"
|
|
viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M11.049 2.927c.3-.921 1.603-.921 1.902 0l1.519 4.674a1 1 0 00.95.69h4.915c.969 0 1.371 1.24.588 1.81l-3.976 2.888a1 1 0 00-.363 1.118l1.518 4.674c.3.922-.755 1.688-1.538 1.118l-3.976-2.888a1 1 0 00-1.176 0l-3.976 2.888c-.783.57-1.838-.197-1.538-1.118l1.518-4.674a1 1 0 00-.363-1.118l-3.976-2.888c-.784-.57-.38-1.81.588-1.81h4.914a1 1 0 00.951-.69l1.519-4.674z">
|
|
</path>
|
|
</svg>
|
|
@else
|
|
<svg class="w-10 h-10 text-secondary" fill="none" stroke="currentColor"
|
|
viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
|
</svg>
|
|
@endif
|
|
</div>
|
|
|
|
<div class="space-y-4">
|
|
<h3 class="text-xl font-medium">{{ $spotlight['title'] }}</h3>
|
|
<p class="text-muted-foreground leading-relaxed">
|
|
{{ $spotlight['description'] }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</section>
|