diff --git a/app/styles/base.css b/app/styles/base.css index 0ec7f9b..4a4aaeb 100644 --- a/app/styles/base.css +++ b/app/styles/base.css @@ -99,7 +99,6 @@ nav:where(.sticky, .fixed), [class*="grid"]>* { content-visibility: auto; contain-intrinsic-size: auto 400px; - contain: layout style paint; } [class*="grid"]>a { diff --git a/components/adult/AdultContentGrid.tsx b/components/adult/AdultContentGrid.tsx index 6a64f7e..86c1fad 100644 --- a/components/adult/AdultContentGrid.tsx +++ b/components/adult/AdultContentGrid.tsx @@ -42,7 +42,6 @@ export function AdultContentGrid({ { // Allow default behavior for modifier keys (new tab, etc.) if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return; @@ -50,13 +49,17 @@ export function AdultContentGrid({ e.preventDefault(); onVideoClick?.(video); }} + className="group cursor-pointer hover:translate-y-[-2px] transition-transform duration-200 ease-out" style={{ - contain: 'layout style paint', + position: 'relative', + zIndex: 1, contentVisibility: 'auto' }} + onMouseEnter={(e) => (e.currentTarget.style.zIndex = '100')} + onMouseLeave={(e) => (e.currentTarget.style.zIndex = '1')} > - -
+ +
{video.vod_pic ? ( (e.currentTarget.style.zIndex = '100')} + onMouseLeave={(e) => (e.currentTarget.style.zIndex = '1')} > - -
+ +
{movie.title}(({ return (
@@ -39,19 +39,24 @@ export const VideoCard = memo(({ role="listitem" aria-label={`${video.vod_name}${video.vod_remarks ? ` - ${video.vod_remarks}` : ''}`} prefetch={false} + className="group cursor-pointer hover:translate-y-[-2px] transition-transform duration-200 ease-out block h-full" + style={{ + position: 'relative', + zIndex: 1, + }} + onMouseEnter={(e) => (e.currentTarget.style.zIndex = '100')} + onMouseLeave={(e) => (e.currentTarget.style.zIndex = '1')} > {/* Poster */} -
+
{video.vod_pic ? (