From 2f46a4555e5ec8eb5299303426623ed5b9026f50 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Sun, 23 Aug 2020 10:52:26 +0200
Subject: [PATCH] Fix weird nth-child global CSS compilation by using a
 conditional class

---
 src/molecules/Photo.svelte       | 5 +++--
 src/style/organisms/_photos.scss | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/molecules/Photo.svelte b/src/molecules/Photo.svelte
index 4795181..b014625 100644
--- a/src/molecules/Photo.svelte
+++ b/src/molecules/Photo.svelte
@@ -21,6 +21,7 @@
     const nameSplit = name.split(', ')
 
     // Photo index
+    const odd = index % 2 === 1
     const photoIndex = (index < 10 ? '0': '') + index
 
 
@@ -32,11 +33,11 @@
     })
 </script>
 
-<div class="photo" role="figure" aria-labelledby="photo-{index + 1}" bind:this={scope}>
+<div class="photo" class:photo--odd={odd} role="figure" aria-labelledby="photo-{index + 1}" bind:this={scope}>
     <div class="photo__location wrap">
         <div class="wrapper">
             <h2 class="title-location" id="photo-{index + 1}">
-                {#each nameSplit as line, i}
+                {#each nameSplit as _, i}
                 <span class="line">
                     <span>
                         {nameSplit[i]}{#if i < nameSplit.length - 1},{/if}
diff --git a/src/style/organisms/_photos.scss b/src/style/organisms/_photos.scss
index 4b5c85f..4465465 100644
--- a/src/style/organisms/_photos.scss
+++ b/src/style/organisms/_photos.scss
@@ -194,7 +194,7 @@
             }
 
             // Every second (on column 2)
-            &:nth-child(2n+2) {
+            &--odd {
                 @include breakpoint (md) {
                     transform: translateY(-64px);
                 }