Make Location hover preview images global on env

.env.local

@@ -1,5 +1,6 @@
 # Options
 VITE_LIMIT_TIME=2 * 7 * 24 * 60 * 60 * 1000
+VITE_PREVIEW_COUNT=4
 
 # API related
 # VITE_API_URL_DEV="http://192.168.1.19:8055"

src/components/molecules/Location.svelte

@@ -36,7 +36,7 @@
         }))
 
         // Change photo index from mouse position percentage
-        photoIndex = Math.round(lerp(0, 3, moveProgress))
+        photoIndex = Math.round(lerp(0, Number(import.meta.env.VITE_PREVIEW_COUNT) - 1, moveProgress))
     }
 
     // Leaving mouseover
@@ -76,7 +76,8 @@
             {#each location.photos as photo, index}
                 <Image
                     class={index === photoIndex ? 'is-visible' : null}
-                    id={photo.image.id} alt={photo.image.title} width={240} height={160} quality={70}
+                    id={photo.image.id} alt={photo.image.title}
+                    width={340} height={226} quality={70}
                 />
             {/each}
         </div>

src/routes/__layout.svelte

@@ -36,7 +36,7 @@
                         }
                     }
                     date_updated
-                    photos (sort: "-date_created", limit: 4) {
+                    photos (sort: "-date_created", limit: ${import.meta.env.VITE_PREVIEW_COUNT}) {
                         image {
                             id
                             title