From dc20d18b04513813501a549f753a7c36463e1f28 Mon Sep 17 00:00:00 2001
From: David Mzareulyan <david@hiero.ru>
Date: Tue, 4 Feb 2025 21:55:51 +0300
Subject: [PATCH] Fix lightbox opening animation for video

---
 .../post/attachments/attachments.module.scss  |  4 ++++
 src/components/post/attachments/visual.jsx    | 19 +++++++++++++++----
 2 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/components/post/attachments/attachments.module.scss b/src/components/post/attachments/attachments.module.scss
index c1f12bcb2..a295bbf0a 100644
--- 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
index a0ccdd699..07fc563e6 100644
--- 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}