Fix overlay in safari and firefox (#10015)

This commit is contained in:
Nicolas Mowen 2024-02-24 06:48:18 -07:00 committed by GitHub
parent 02dfa1222e
commit d73c8bb90c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -96,7 +96,8 @@ export default function PreviewThumbnailPlayer({
return ( return (
<ContextMenu> <ContextMenu>
<ContextMenuTrigger <ContextMenuTrigger asChild>
<div
className="relative w-full h-full cursor-pointer" className="relative w-full h-full cursor-pointer"
onMouseEnter={isMobile ? undefined : () => onPlayback(true)} onMouseEnter={isMobile ? undefined : () => onPlayback(true)}
onMouseLeave={isMobile ? undefined : () => onPlayback(false)} onMouseLeave={isMobile ? undefined : () => onPlayback(false)}
@ -117,7 +118,10 @@ export default function PreviewThumbnailPlayer({
playingBack ? "opacity-0" : "opacity-100" playingBack ? "opacity-0" : "opacity-100"
}`} }`}
loading="lazy" loading="lazy"
src={`${apiHost}${review.thumb_path.replace("/media/frigate/", "")}`} src={`${apiHost}${review.thumb_path.replace(
"/media/frigate/",
""
)}`}
/> />
{(review.severity == "alert" || review.severity == "detection") && ( {(review.severity == "alert" || review.severity == "detection") && (
<Chip className="absolute top-2 left-2 flex gap-1 bg-gradient-to-br from-gray-400 to-gray-500 bg-gray-500 z-0"> <Chip className="absolute top-2 left-2 flex gap-1 bg-gradient-to-br from-gray-400 to-gray-500 bg-gray-500 z-0">
@ -158,6 +162,7 @@ export default function PreviewThumbnailPlayer({
{!playingBack && review.has_been_reviewed && ( {!playingBack && review.has_been_reviewed && (
<div className="absolute left-0 top-0 bottom-0 right-0 bg-black bg-opacity-60" /> <div className="absolute left-0 top-0 bottom-0 right-0 bg-black bg-opacity-60" />
)} )}
</div>
</ContextMenuTrigger> </ContextMenuTrigger>
<PreviewContextItems review={review} setReviewed={setReviewed} /> <PreviewContextItems review={review} setReviewed={setReviewed} />
</ContextMenu> </ContextMenu>