Improve video card display behavior when hovering within carousels

Refactor CSS selectors in `client/src/index.css` to more precisely target parent elements for overflow visibility when hovering over video cards, specifically within carousel and grid containers, avoiding unintended overflow changes on general scrollable elements.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/kdQ95gE
This commit is contained in:
sebastjanartic 2025-08-29 18:18:05 +00:00
parent 29d9ad3eec
commit 5bb9153c99

View File

@ -388,14 +388,14 @@ input[data-testid*="search"]::placeholder {
} }
/* Force all parent elements to be overflow visible when video card is hovered */ /* Force all parent elements to be overflow visible when video card is hovered */
.video-card:hover, .video-card:hover {
.video-card:hover * {
z-index: 999999 !important; z-index: 999999 !important;
} }
/* Force all ancestors to show overflow when video is hovered */ /* Only target specific carousel containers, not scroll containers */
body:has(.video-card:hover) *, .carousel-track:has(.video-card:hover),
html:has(.video-card:hover) * { .netflix-grid-container:has(.video-card:hover),
div:has(.video-card:hover):not([class*="overflow-x-auto"]):not([class*="overflow-y-auto"]) {
overflow: visible !important; overflow: visible !important;
} }