From 239a47104e14743e8a23824f166644b51cdcd12a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Thu, 16 Apr 2020 17:20:29 +0200
Subject: [PATCH] Use lazySizes globally

---
 src/molecules/Photo.svelte                   |  3 +--
 src/organisms/Carousel.svelte                |  1 -
 src/routes/_layout.svelte                    |  7 ++++++-
 src/routes/location/[country]/[place].svelte | 11 ++---------
 4 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/src/molecules/Photo.svelte b/src/molecules/Photo.svelte
index 0973c6e..88ea361 100644
--- a/src/molecules/Photo.svelte
+++ b/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>
diff --git a/src/organisms/Carousel.svelte b/src/organisms/Carousel.svelte
index fdc7831..ca321df 100644
--- a/src/organisms/Carousel.svelte
+++ b/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
diff --git a/src/routes/_layout.svelte b/src/routes/_layout.svelte
index a083a8e..b9d0755 100644
--- a/src/routes/_layout.svelte
+++ b/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
diff --git a/src/routes/location/[country]/[place].svelte b/src/routes/location/[country]/[place].svelte
index 63967d3..a825925 100644
--- a/src/routes/location/[country]/[place].svelte
+++ b/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)}
-                layout={layoutSetting}
-            />
+            <Photo {photo} index={photos.length - photos.indexOf(photo)} />
             {/each}
         </div>
 
-        <Pagination
-            {photos} {paginatedPhotos} {photosPerPage}
+        <Pagination {photos} {paginatedPhotos} {photosPerPage}
             on:updatePagination={updatePagination}
         />