From 5444d21404610a92734826120784158e4c4dd0cd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Wed, 31 Aug 2022 18:42:04 +0200
Subject: [PATCH] Fix Photos page Reset button position

---
 src/routes/photos/+page.svelte | 20 ++++++++++----------
 src/style/pages/_photos.scss   | 17 +++--------------
 2 files changed, 13 insertions(+), 24 deletions(-)

diff --git a/src/routes/photos/+page.svelte b/src/routes/photos/+page.svelte
index efc4ba4..2c3bbe6 100644
--- a/src/routes/photos/+page.svelte
+++ b/src/routes/photos/+page.svelte
@@ -410,17 +410,17 @@
                         </Select>
                     </li>
                 </ul>
-            </div>
 
-            <div class="filters__actions">
-                {#if filtered}
-                    <button class="reset button-link"
-                        on:click={resetFiltered}
-                        transition:fly={{ y: 4, duration: 600, easing: quartOutSvelte }}
-                    >
-                        Reset
-                    </button>
-                {/if}
+                <div class="filters__actions">
+                    {#if filtered}
+                        <button class="reset button-link"
+                            on:click={resetFiltered}
+                            transition:fly={{ y: 4, duration: 600, easing: quartOutSvelte }}
+                        >
+                            Reset
+                        </button>
+                    {/if}
+                </div>
             </div>
         </div>
     </section>
diff --git a/src/style/pages/_photos.scss b/src/style/pages/_photos.scss
index 56e01bd..596494e 100644
--- a/src/style/pages/_photos.scss
+++ b/src/style/pages/_photos.scss
@@ -381,35 +381,24 @@
         @include bp (sm) {
             position: absolute;
             top: 50%;
-            right: 56px;
+            right: 20px;
             transform: translateY(-50%);
             margin-top: 0;
         }
 
         // Reset link
         .reset {
-            margin-right: 16px;
-            padding: 0;
+            padding: 0 12px;
             color: rgba($color-tertiary, 0.6);
             font-weight: 900;
             font-size: rem(14px);
             transition: color 0.3s;
+            transform: translateZ(0);
 
             &:hover {
                 color: $color-tertiary;
             }
         }
-
-        // Shuffle button
-        // .shuffle {
-        //     display: flex;
-        //     align-items: center;
-        //     justify-content: center;
-        //     height: 32px;
-        //     background-color: $color-tertiary;
-        //     padding: 0 16px;
-        //     border-radius: 50vh;
-        // }
     }