This commit is contained in:
Vula Builder
2026-07-27 18:59:55 +00:00
parent e051fc0909
commit b2eb03dfaa
@@ -0,0 +1,49 @@
import Image from 'next/image'
import Link from 'next/link'
import { getAdvertBanners } from '@/lib/cms'
export default async function AdvertBannerSection() {
const items = await getAdvertBanners()
const now = Date.now()
const banner = items.find(item => {
const start = item.data.start_date ? new Date(item.data.start_date as string).getTime() : 0
const end = item.data.end_date ? new Date(item.data.end_date as string).getTime() : Infinity
return now >= start && now <= end
}) ?? items[0]
if (!banner) return null
const { headline, subheadline, cta_text, cta_url, image } = banner.data as {
headline: string; subheadline?: string; cta_text?: string; cta_url?: string; image?: string
}
return (
<section className="relative w-full overflow-hidden rounded-2xl my-8 mx-auto max-w-7xl px-4">
{image ? (
<div className="relative h-64 md:h-80 w-full">
<Image src={image} alt={headline} fill className="object-cover rounded-2xl" />
<div className="absolute inset-0 bg-black/45 rounded-2xl" />
<div className="absolute inset-0 flex flex-col items-center justify-center text-center px-6 gap-3">
<h2 className="text-2xl md:text-4xl font-bold text-white drop-shadow">{headline}</h2>
{subheadline && <p className="text-sm md:text-base text-white/90">{subheadline}</p>}
{cta_text && cta_url && (
<Link href={cta_url} className="mt-2 inline-block bg-white text-black font-semibold px-6 py-2 rounded-full hover:bg-primary hover:text-white transition-colors text-sm">
{cta_text}
</Link>
)}
</div>
</div>
) : (
<div className="flex flex-col items-center justify-center gap-3 py-16 px-6 text-center bg-primary/10 rounded-2xl">
<h2 className="text-2xl md:text-3xl font-bold">{headline}</h2>
{subheadline && <p className="text-muted-foreground">{subheadline}</p>}
{cta_text && cta_url && (
<Link href={cta_url} className="inline-block bg-primary text-white font-semibold px-6 py-2 rounded-full hover:bg-primary/80 transition-colors text-sm">
{cta_text}
</Link>
)}
</div>
)}
</section>
)
}