Fix banner image display

This commit is contained in:
gpt-engineer-app[bot]
2025-10-02 14:59:07 +00:00
parent fc2d1e9bc5
commit 94c60f1821

View File

@@ -248,11 +248,19 @@ export default function ParkDetail() {
{/* Hero Section */}
<div className="relative mb-8">
<div className="aspect-[21/9] bg-gradient-to-br from-primary/20 via-secondary/20 to-accent/20 rounded-lg overflow-hidden relative">
{park.banner_image_url ? <img src={park.banner_image_url} alt={park.name} className="w-full h-full object-cover" /> : <div className="flex items-center justify-center h-full">
{(park.banner_image_url || park.banner_image_id) ? (
<img
src={park.banner_image_url || `https://imagedelivery.net/X-2-mmiWukWxvAQQ2_o-7Q/${park.banner_image_id}/public`}
alt={park.name}
className="w-full h-full object-cover"
/>
) : (
<div className="flex items-center justify-center h-full">
<div className="opacity-50">
{getParkTypeIcon(park.park_type)}
</div>
</div>}
</div>
)}
<div className="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent" />
{/* Park Title Overlay */}