Upload 3 files

js/cards/HomeAreaCard.js

@@ -1,7 +1,7 @@
 // HomeAreaCard.js - Area card component for homepage
 import { areasData } from '../data/areas.js';
 
-export function createHomeAreaCard(id, title, description, openness, subAreas, imagePosition = 'left', imageAttribution = null, altText = null) {
+export function createHomeAreaCard(id, title, description, openness, subAreas, image, imagePosition = 'left', imageAttribution = null, altText = null) {
     const flexDirection = imagePosition === 'left' ? 'lg:flex-row' : 'lg:flex-row-reverse';
     
     const subAreasList = subAreas.map(area => `<li>${area}</li>`).join('');
@@ -36,7 +36,7 @@ export function createHomeAreaCard(id, title, description, openness, subAreas, i
                 </div>
                 <div class="lg:w-1/3 bg-gray-100">
                     <div class="h-full flex flex-col items-center justify-center p-8">
-                        <img src="images/${id}.png" alt="${imgAlt}" class="max-w-full max-h-full object-contain">
+                        <img src="images/${image}" alt="${imgAlt}" class="max-w-full max-h-full object-contain">
                         ${attribution}
                     </div>
                 </div>