From 02884fef4db0abbb9b31f1bd2925746b4ae7fd00 Mon Sep 17 00:00:00 2001
From: andrzej <andrzejjamesstepien@gmail.com>
Date: Mon, 7 Oct 2024 18:12:51 +0200
Subject: [PATCH] stop posters from sliding on load

---
 src/objects/movie-wall.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/objects/movie-wall.tsx b/src/objects/movie-wall.tsx
index c0d6cbc..7c45c3b 100644
--- a/src/objects/movie-wall.tsx
+++ b/src/objects/movie-wall.tsx
@@ -48,7 +48,7 @@ export function MovieWall({ movies, setMovies, config, setChosenMovie, setSimila
 
     const borderColor = isHighlighted ? "border-orange-300" : "border-gray-300"
     posters.push(
-      <Poster className={"w-16 sm:w-28 xl:w-36 aspect-poster rounded-xl border-2 overflow-hidden relative flex item-center justify-center " + borderColor} isHighlighted={isHighlighted} movie={movie} key={movie.id} index={i}
+      <Poster className={"w-16 sm:w-28 xl:w-36 aspect-poster rounded-xl border-2 overflow-hidden relative " + borderColor} isHighlighted={isHighlighted} movie={movie} key={movie.id} index={i}
         listSimilar={tmdb.getSimilar}
         config={config}
         setMovies={setMovies}
@@ -89,7 +89,7 @@ function Poster({ className, movie, config, listSimilar, setMovies, setChosenMov
     }
     {hasError ?? <div className="m-auto text-center">⚠️</div>}
     <img
-      className="animate-blur object-cover w-full"
+      className="animate-blur object-cover w-full aspect-poster"
       src={tmdb.makeImgUrl(movie.poster_path ?? "")}
       onLoad={() => setIsLoading(false)}
       onError={() => setHasError(true)}