59 lines
2.9 KiB
PHP
59 lines
2.9 KiB
PHP
@php
|
|
$sectionItems = collect(is_array($items ?? null) ? $items : [])
|
|
->filter(fn ($item) => !data_get($item, 'maturity.should_hide', false))
|
|
->values();
|
|
$sectionLayout = $layout ?? 'grid';
|
|
$sectionColumns = $columns ?? 'xl:grid-cols-4';
|
|
$shouldRenderEmpty = !empty($emptyMessage);
|
|
@endphp
|
|
|
|
@if ($sectionItems->isNotEmpty() || $shouldRenderEmpty)
|
|
<section class="mt-14 px-4 sm:px-6 lg:px-8">
|
|
<div class="mb-5 flex flex-col gap-3 md:flex-row md:items-end md:justify-between">
|
|
<div>
|
|
@if (!empty($eyebrow))
|
|
<p class="text-[0.7rem] font-semibold uppercase tracking-[0.28em] text-sky-200/70">{{ $eyebrow }}</p>
|
|
@endif
|
|
<h2 class="text-xl font-bold text-white">{{ $title }}</h2>
|
|
@if (!empty($description))
|
|
<p class="mt-1 max-w-2xl text-sm text-slate-300">{{ $description }}</p>
|
|
@endif
|
|
</div>
|
|
@if (!empty($href))
|
|
<a href="{{ $href }}" class="text-sm text-nova-300 transition hover:text-white">
|
|
See all →
|
|
</a>
|
|
@endif
|
|
</div>
|
|
|
|
@if ($sectionItems->isNotEmpty())
|
|
<div class="{{ $sectionLayout === 'rail' ? 'flex snap-x snap-mandatory gap-4 overflow-x-auto pb-3 ' . $sectionColumns . ' lg:grid lg:overflow-visible' : 'grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-3 ' . $sectionColumns }}">
|
|
@foreach ($sectionItems as $index => $item)
|
|
@include('web.home.sections.artwork-card', [
|
|
'item' => $item,
|
|
'layout' => $sectionLayout,
|
|
'badge' => $badge ?? null,
|
|
'badgeClass' => $badge_class ?? null,
|
|
'sizes' => $sectionLayout === 'rail'
|
|
? '(max-width: 640px) 72vw, (max-width: 1024px) 44vw, 240px'
|
|
: '(max-width: 640px) 100vw, (max-width: 768px) 50vw, (max-width: 1024px) 33vw, 25vw',
|
|
'idPrefix' => Str::slug((string) $title, '-'),
|
|
'index' => $index,
|
|
])
|
|
@endforeach
|
|
</div>
|
|
@else
|
|
<div class="rounded-2xl border border-white/5 bg-nova-800/40 px-6 py-10 text-center">
|
|
<p class="text-sm text-soft">{{ $emptyMessage }}</p>
|
|
@if (!empty($emptyDescription))
|
|
<p class="mt-1 text-xs text-nova-400">{{ $emptyDescription }}</p>
|
|
@endif
|
|
@if (!empty($emptyCtaHref) && !empty($emptyCtaLabel))
|
|
<a href="{{ $emptyCtaHref }}" class="mt-4 inline-flex items-center rounded-xl bg-nova-700 px-4 py-2 text-sm font-medium text-white transition hover:bg-nova-600">
|
|
{{ $emptyCtaLabel }} →
|
|
</a>
|
|
@endif
|
|
</div>
|
|
@endif
|
|
</section>
|
|
@endif |