Improve video display by adjusting hover effects and layering

Adjusted CSS in client/src/index.css for .individual-video-hover to simplify the hover effect, removing unnecessary positioning and pointer-events properties.

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:04:11 +00:00
parent 05a71521d9
commit f33fddaaf9
2 changed files with 2 additions and 18 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 177 KiB

View File

@ -387,27 +387,11 @@ input[data-testid*="search"]::placeholder {
opacity: 0;
}
/* Force hover video above everything - escape parent overflow */
/* Simple hover video effect - just higher z-index */
.individual-video-hover:hover {
z-index: 9999 !important;
position: relative !important;
transform: scale(1.05) translateZ(0) !important;
transform: scale(1.05) !important;
transition: all 0.3s ease !important;
pointer-events: auto !important;
will-change: transform !important;
}
/* Force all carousel containers to allow z-index stacking */
.individual-video-hover:hover,
.individual-video-hover:hover * {
position: relative !important;
z-index: inherit !important;
}
/* Ensure parent carousel doesn't clip hovering videos */
div:has(.individual-video-hover:hover) {
overflow: visible !important;
position: relative !important;
}
/* Hide picture-in-picture button on all video elements */