From d7e7fc68ba53548d177ce45d5cf5769ac25e83b8 Mon Sep 17 00:00:00 2001
From: Spedon <hi@sped0nwen.com>
Date: Sun, 17 Mar 2024 16:15:13 +0800
Subject: [PATCH] refactor: improve top position calculation in stylesheets
 (#302)

* refactor: improve top position calculation in stylesheets

- Update the top position calculation in the `_collection.scss` file

* refactor: tweak it harder

* Revert "refactor: tweak it harder"

This reverts commit b7bf7e50f8114aca48491e49cf2e0a1993b4185b.
---
 assets/scss/_partial/_collection.scss | 6 +++---
 assets/ts/mobile/collection.tsx       | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/assets/scss/_partial/_collection.scss b/assets/scss/_partial/_collection.scss
index ec63f67..59b242a 100644
--- a/assets/scss/_partial/_collection.scss
+++ b/assets/scss/_partial/_collection.scss
@@ -3,12 +3,12 @@
   flex-direction: column;
   gap: 20vh;
 
-  padding-top: 50vh;
+  padding-top: calc(var(--window-height) * 0.4);
   margin-top: calc(var(--nav-height) * -1);
 
   img {
     position: sticky;
-    top: 50vh;
+    top: calc(var(--window-height) * 0.4);
 
     width: 60vw;
     height: 20vh;
@@ -19,7 +19,7 @@
     align-self: center;
 
     &:last-child {
-      margin-bottom: 20vh;
+      margin-bottom: calc(var(--window-height) * 0.35);
     }
   }
 }
diff --git a/assets/ts/mobile/collection.tsx b/assets/ts/mobile/collection.tsx
index fd34c8d..458b30f 100644
--- a/assets/ts/mobile/collection.tsx
+++ b/assets/ts/mobile/collection.tsx
@@ -116,7 +116,7 @@ export default function Collection(props: {
               data-src={ij.loUrl}
               alt={ij.alt}
               style={{
-                transform: `translate3d(${i() !== 0 ? getRandom(-25, 25) : 0}%, ${i() !== 0 ? getRandom(-30, 30) : 0}%, 0)`
+                transform: `translate3d(${i() !== 0 ? getRandom(-25, 25) : 0}%, ${i() !== 0 ? getRandom(-35, 35) : 0}%, 0)`
               }}
               onClick={() => {
                 handleClick(i())