From 94c60f1821118f9152016372db462801c484ec18 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Thu, 2 Oct 2025 14:59:07 +0000
Subject: [PATCH] Fix banner image display

---
 src/pages/ParkDetail.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/pages/ParkDetail.tsx b/src/pages/ParkDetail.tsx
index 6a4e4a0e..c6ade33c 100644
--- a/src/pages/ParkDetail.tsx
+++ b/src/pages/ParkDetail.tsx
@@ -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 */}