61 lines
4.2 KiB
PHP
61 lines
4.2 KiB
PHP
@php
|
|
$homepageAnnouncement = is_array($announcement ?? null) ? $announcement : null;
|
|
$overlayOpacity = max(0, min(100, (int) ($homepageAnnouncement['overlay_opacity'] ?? 55)));
|
|
@endphp
|
|
|
|
@if ($homepageAnnouncement)
|
|
<section class="px-4 pt-8 sm:px-6 lg:px-8">
|
|
<div class="relative mx-auto max-w-7xl overflow-hidden rounded-[2rem] border border-cyan-300/15 bg-[radial-gradient(circle_at_top_left,rgba(34,211,238,0.26),transparent_30%),radial-gradient(circle_at_80%_20%,rgba(168,85,247,0.22),transparent_28%),linear-gradient(135deg,rgba(6,12,24,0.96),rgba(10,17,34,0.9))] text-white shadow-[0_28px_90px_rgba(0,0,0,0.35)]">
|
|
@if (!empty($homepageAnnouncement['background_image_url']))
|
|
<div class="absolute inset-0">
|
|
<img src="{{ $homepageAnnouncement['background_image_url'] }}" alt="" class="h-full w-full object-cover">
|
|
<div class="absolute inset-0 bg-slate-950" style="opacity: {{ $overlayOpacity / 100 }}"></div>
|
|
</div>
|
|
@endif
|
|
|
|
<div class="pointer-events-none absolute inset-0 bg-gradient-to-br from-indigo-400/20 via-sky-400/12 to-transparent"></div>
|
|
<div class="pointer-events-none absolute inset-0 bg-[linear-gradient(180deg,rgba(255,255,255,0.06),transparent_22%,rgba(2,6,23,0.15)_100%)]"></div>
|
|
|
|
<div class="relative grid gap-8 px-6 py-7 sm:px-8 lg:grid-cols-[minmax(0,1.25fr)_auto] lg:items-end lg:px-10 lg:py-10">
|
|
<div class="max-w-3xl">
|
|
@if (!empty($homepageAnnouncement['badge_text']))
|
|
<div class="inline-flex rounded-full border border-cyan-200/20 bg-cyan-300/10 px-3 py-1 text-[11px] font-semibold uppercase tracking-[0.24em] text-cyan-100">
|
|
{{ $homepageAnnouncement['badge_text'] }}
|
|
</div>
|
|
@endif
|
|
|
|
<h2 class="mt-4 text-3xl font-semibold tracking-[-0.05em] sm:text-4xl lg:text-[3.15rem]">
|
|
{{ $homepageAnnouncement['title'] ?? '' }}
|
|
</h2>
|
|
|
|
@if (!empty($homepageAnnouncement['subtitle']))
|
|
<p class="mt-3 max-w-2xl text-base leading-7 text-white/80 sm:text-lg">
|
|
{{ $homepageAnnouncement['subtitle'] }}
|
|
</p>
|
|
@endif
|
|
|
|
@if (!empty($homepageAnnouncement['content_html']))
|
|
<div class="prose prose-invert mt-5 max-w-2xl text-sm leading-7 prose-a:text-cyan-200 prose-strong:text-white [&_blockquote]:my-5 [&_h2]:mb-3 [&_h2]:mt-7 [&_h3]:mb-2 [&_h3]:mt-6 [&_li+li]:mt-1.5 [&_ol]:my-5 [&_p]:my-0 [&_p+p]:mt-6 [&_ul]:my-5 sm:text-base">
|
|
{!! $homepageAnnouncement['content_html'] !!}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
<div class="flex flex-col items-start gap-3 lg:items-end">
|
|
<div class="flex flex-wrap gap-3 lg:justify-end">
|
|
@if (!empty($homepageAnnouncement['primary_link']['url']) && !empty($homepageAnnouncement['primary_link']['label']))
|
|
<a href="{{ $homepageAnnouncement['primary_link']['url'] }}" class="inline-flex items-center justify-center rounded-full border border-cyan-300/30 bg-cyan-300/15 px-5 py-3 text-sm font-semibold text-cyan-50 transition hover:bg-cyan-300/22">
|
|
{{ $homepageAnnouncement['primary_link']['label'] }}
|
|
</a>
|
|
@endif
|
|
@if (!empty($homepageAnnouncement['secondary_link']['url']) && !empty($homepageAnnouncement['secondary_link']['label']))
|
|
<a href="{{ $homepageAnnouncement['secondary_link']['url'] }}" class="inline-flex items-center justify-center rounded-full border border-white/12 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white/85 transition hover:bg-white/[0.1]">
|
|
{{ $homepageAnnouncement['secondary_link']['label'] }}
|
|
</a>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
@endif |