Use lazySizes globally

src/molecules/Photo.svelte

@@ -8,7 +8,6 @@
     // Props and variables
     export let photo
     export let index
-    export let layout = 'list'
     let scope
 
     // Default size for the image
@@ -57,7 +56,7 @@
                     <img src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
                         width={defaultWidth} height={defaultHeight}
                         alt={imgAlt}
-                        class:lazyload={layout === 'list'}
+                        class="lazyload"
                     />
                 </picture>
             </a>

src/organisms/Carousel.svelte

@@ -5,7 +5,6 @@
     import { getThumbnail, formatDate } from 'utils/functions'
     // Dependencies
     import SwipeListener from 'swipe-listener'
-    import lazySizes from 'lazysizes'
     // Animations
     import { animateIn } from 'animations/Carousel'
     // Components

src/routes/_layout.svelte

@@ -73,12 +73,17 @@
         locations,
         pageReady
     } from 'utils/store'
-    // Components
+    // Dependencies
+    import lazySizes from 'lazysizes'
 
     // Variables
     const { page } = stores()
     let AnalyticsTracker
 
+    // Settings
+    lazySizes.cfg.lazyClass = 'lazyload'
+
+
 
     /*
     ** Manipulate data

src/routes/location/[country]/[place].svelte

@@ -32,8 +32,6 @@
         pageReady
     } from 'utils/store'
     import { formatDate, relativeTime, getThumbnail } from 'utils/functions'
-    // Dependencies
-    import lazySizes from 'lazysizes'
     // Components
     import IconGlobe from 'atoms/IconGlobe'
     import IconGlobeSmall from 'atoms/IconGlobeSmall'
@@ -184,16 +182,11 @@
         {#if photos}
         <div class="photos__view wrap">
             {#each paginatedPhotos as photo, index}
-            <Photo
+            <Photo {photo} index={photos.length - photos.indexOf(photo)} />
-                photo={photo}
-                index={photos.length - photos.indexOf(photo)}
-                layout={layoutSetting}
-            />
             {/each}
         </div>
 
-        <Pagination
+        <Pagination {photos} {paginatedPhotos} {photosPerPage}
-            {photos} {paginatedPhotos} {photosPerPage}
             on:updatePagination={updatePagination}
         />