Adjust video grid spacing and width for better viewing
Update client/src/components/netflix-grid.tsx to adjust horizontal padding and individual video item width for improved display on various screen sizes. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 50f1ae50-8e22-495d-bb42-127d908a9bc5 Replit-Commit-Checkpoint-Type: full_checkpoint
This commit is contained in:
parent
46e018c790
commit
e1314807be
@ -410,7 +410,7 @@ function CategoryRow({ category, onVideoClick, hideScrollButtons = false }: Cate
|
||||
{/* Scrollable video row - in container */}
|
||||
<div
|
||||
ref={scrollRef}
|
||||
className="flex gap-1 md:gap-3 overflow-x-auto scrollbar-hide py-2 md:py-4 px-2 md:px-2"
|
||||
className="flex gap-2 md:gap-3 overflow-x-auto scrollbar-hide py-2 md:py-4 px-3 md:px-2"
|
||||
style={{
|
||||
scrollbarWidth: 'none',
|
||||
msOverflowStyle: 'none',
|
||||
@ -424,7 +424,7 @@ function CategoryRow({ category, onVideoClick, hideScrollButtons = false }: Cate
|
||||
{category.videos.map((video, index) => (
|
||||
<div
|
||||
key={video.id}
|
||||
className="flex-shrink-0 w-[calc(100vw-2rem)] sm:w-[330px] relative hover:z-50"
|
||||
className="flex-shrink-0 w-[calc(100vw-2.5rem)] sm:w-[330px] relative hover:z-50"
|
||||
style={{
|
||||
scrollSnapAlign: window.innerWidth < 768 ? 'start' : 'none'
|
||||
}}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user