From b66c53bef3ec890897df0cb6b54ec033f43380b5 Mon Sep 17 00:00:00 2001
From: Alex <alex.tran1502@gmail.com>
Date: Tue, 19 Nov 2024 11:30:07 -0600
Subject: [PATCH] fix(web): layout shifting when scrolling up (#14226)

* fix(web): layout shifting when scrolling up

* feedback
---
 web/src/lib/components/photos-page/asset-grid.svelte | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/web/src/lib/components/photos-page/asset-grid.svelte b/web/src/lib/components/photos-page/asset-grid.svelte
index 775b2a9282..5055cdcf4b 100644
--- a/web/src/lib/components/photos-page/asset-grid.svelte
+++ b/web/src/lib/components/photos-page/asset-grid.svelte
@@ -857,7 +857,7 @@
       {@const isPremeasure = preMeasure.includes(bucket)}
       {@const display = bucket.intersecting || bucket === $assetStore.pendingScrollBucket || isPremeasure}
       <div
-        id="bucket"
+        class="bucket"
         use:intersectionObserver={{
           key: bucket.viewId,
           onIntersect: () => handleIntersect(bucket),
@@ -931,4 +931,9 @@
     contain: strict;
     scrollbar-width: none;
   }
+
+  .bucket {
+    contain: layout size;
+    transition: height 0.2s ease-out;
+  }
 </style>