diff --git a/client/src/components/netflix-grid.tsx b/client/src/components/netflix-grid.tsx index 9f623a4..194ae7c 100644 --- a/client/src/components/netflix-grid.tsx +++ b/client/src/components/netflix-grid.tsx @@ -154,8 +154,8 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) { if (direction === 'right' && newX <= -singleSetWidth * 2) { // When moved past second copy, wrap to start of first copy return newX + singleSetWidth; - } else if (direction === 'left' && newX >= singleSetWidth) { - // When moved past first copy left boundary, wrap to second copy + } else if (direction === 'left' && newX > 0) { + // When moving left past start, wrap to end of second copy return newX - singleSetWidth; } @@ -233,8 +233,9 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) { // Initialize with first video on the left side useEffect(() => { if (category.videos.length > 0) { - // Start at the beginning of first copy (0 position) - setTranslateX(0); + // Start positioned to show middle copy for seamless wrapping + const singleSetWidth = category.videos.length * 220; + setTranslateX(-singleSetWidth); } }, [category.videos.length]);