From 0e554e20a8643045aef13dd391b4275902e29084 Mon Sep 17 00:00:00 2001
From: sebastjanartic <45803536-sebastjanartic@users.noreply.replit.com>
Date: Fri, 29 Aug 2025 18:09:07 +0000
Subject: [PATCH] Improve video visibility during hover interactions

Refine CSS rules in client/src/index.css to ensure videos remain visible when hovered, specifically addressing overflow and clip-path properties for parent containers, including specialized handling for horizontally scrolling containers.

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
---
 client/src/index.css | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/client/src/index.css b/client/src/index.css
index a0e6c70..1680570 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -398,12 +398,18 @@ input[data-testid*="search"]::placeholder {
   isolation: auto !important;
 }
 
-/* Force specific parent containers to be overflow visible when child is hovered - but preserve scroll containers */
-*:has(.individual-video-hover:hover):not([class*="overflow-x-auto"]) {
+/* Force parent containers to be overflow visible when child is hovered */
+*:has(.individual-video-hover:hover) {
   overflow: visible !important;
   clip-path: none !important;
 }
 
+/* Special handling for scroll containers - allow both horizontal scroll and vertical visibility */
+[class*="overflow-x-auto"]:has(.individual-video-hover:hover) {
+  overflow-x: auto !important;
+  overflow-y: visible !important;
+}
+
 /* Hide picture-in-picture button on all video elements */
 video::-webkit-media-controls-picture-in-picture-button {
   display: none !important;