Files
v2.app.gaertan.art/src/components/global/Banner.tsx
2026-01-31 16:04:29 +01:00

41 lines
1.1 KiB
TypeScript

import { prisma } from "@/lib/prisma";
import { cn } from "@/lib/utils";
import localFont from 'next/font/local';
import Image from "next/image";
const myFont = localFont({
src: './Echotopia-Regular.woff2',
})
export default async function Banner() {
const headerImage = await prisma.artwork.findFirst({
where: { setAsHeader: true },
include: {
file: true
}
})
const alt = headerImage?.altText ?? "Header Image"
const title = "Gaertan Art"
return (
<div className="w-full">
{headerImage && (
<div className="relative w-full h-24 md:h-48 lg:h-48">
<Image
src={`/api/image/modified/${headerImage.file.fileKey}.webp`}
alt={alt}
fill
className="object-cover"
priority
/>
<div className="absolute inset-0 bg-black/40 flex items-center justify-center text-center">
<h1 className={cn(myFont.className, "text-shadow text-white text-3xl md:text-5xl font-bold drop-shadow")}>
{title}
</h1>
</div>
</div>
)}
</div>
);
}