Fix lightbox opening animation for video

FreeFeed · Feb 4, 2025 · dc20d18 · dc20d18
1 parent a140d1e
commit dc20d18
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 4 deletions.
diff --git a/src/components/post/attachments/attachments.module.scss b/src/components/post/attachments/attachments.module.scss
@@ -54,6 +54,10 @@
   cursor: move;
 }
 
+.visual__video {
+  position: absolute;
+}
+
 .visual__overlay {
   position: absolute;
   color: #fff;

diff --git a/src/components/post/attachments/visual.jsx b/src/components/post/attachments/visual.jsx
@@ -68,12 +68,23 @@ export function VisualAttachment({
       target="_blank"
       data-pid={pictureId}
     >
-      {att.mediaType === 'image' ? (
-        <img id={pictureId} src={imageSrc} alt={alt} loading="lazy" width={width} height={height} />
-      ) : (
+      {/**
+       * This image is used for the proper lightbox opening animation,
+       * even if the attachment has 'video' type.
+       */}
+      <img
+        id={pictureId}
+        src={imageSrc}
+        alt={alt}
+        loading="lazy"
+        width={width}
+        height={height}
+        aria-hidden={att.mediaType === 'video'}
+      />
+      {att.mediaType === 'video' && (
         <>
           <video
-            id={pictureId}
+            className={style['visual__video']}
             src={videoSrc}
             poster={imageSrc}
             alt={alt}