Upload 3 files

js/cards/ArtifactSummaryCard.js

@@ -74,7 +74,7 @@ export function createArtifactSummaryCard(artifact, index) {
             <!-- Background image -->
             ${backgroundImage ? `
             <div class="absolute inset-0 opacity-10">
-                <img src="images/${backgroundImage}" alt="" class="w-full h-full object-cover">
+                <img src="/images/${backgroundImage}" alt="" class="w-full h-full object-cover">
             </div>
             ` : ''}
             
@@ -129,7 +129,7 @@ export function createArtifactSummaryCard(artifact, index) {
                         ${backgroundImage ? `
                         <div class="relative group/image">
                             <div class="w-12 h-12 rounded-lg overflow-hidden bg-gray-100 flex items-center justify-center cursor-help" title="${imageCredit}">
-                                <img src="images/${backgroundImage}" alt="${primaryAreaData.name}" class="w-full h-full object-cover opacity-80">
+                                <img src="/images/${backgroundImage}" alt="${primaryAreaData.name}" class="w-full h-full object-cover opacity-80">
                             </div>
                         </div>
                         ` : ''}

js/cards/HomeAreaCard.js

@@ -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/${image}" 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>

js/cards/ResourceCard.js

@@ -54,7 +54,7 @@ export function createResourceCard(resource) {
             <div class="resource-card-top h-48 bg-gradient-to-br from-${primaryColor}-50 to-${primaryColor}-100 relative overflow-hidden">
                 <!-- Background image for top section -->
                 <div class="absolute inset-0 opacity-10">
-                    <img src="images/${primaryArea?.image || 'ai.png'}" alt="" class="w-full h-full object-cover">
+                    <img src="/images/${primaryArea?.image || 'ai.png'}" alt="" class="w-full h-full object-cover">
                 </div>
                 
                 <div class="relative z-10 p-4 h-full flex flex-col">
@@ -87,7 +87,7 @@ export function createResourceCard(resource) {
                             ${subAreaTagsHtml}
                         </div>
                         <div class="w-8 h-8 rounded-full bg-white bg-opacity-50 flex items-center justify-center ml-3 flex-shrink-0">
-                            <img src="images/${primaryArea?.image || 'ai.png'}" alt="" class="w-6 h-6 rounded-full object-cover">
+                            <img src="/images/${primaryArea?.image || 'ai.png'}" alt="" class="w-6 h-6 rounded-full object-cover">
                         </div>
                     </div>
                 </div>
@@ -107,7 +107,7 @@ export function createResourceCard(resource) {
                     <!-- Fallback with background image and text -->
                     <div class="w-full h-full relative overflow-hidden">
                         <div class="absolute inset-0 opacity-50">
-                            <img src="images/${primaryArea?.image || 'ai.png'}" alt="" class="w-full h-full object-cover">
+                            <img src="/images/${primaryArea?.image || 'ai.png'}" alt="" class="w-full h-full object-cover">
                         </div>
                         <div class="absolute inset-0 bg-black bg-opacity-20 flex items-center justify-center">
                             <div class="text-center text-white">