From 6e282efd731d9859670843ac413e811fe06dc81c Mon Sep 17 00:00:00 2001
From: root <root@nonebot.top>
Date: Wed, 18 Feb 2026 00:05:56 +0800
Subject: [PATCH] =?UTF-8?q?fix(video-ios):=20=E5=B7=A5=E4=BD=9C=E5=8C=BA?=
 =?UTF-8?q?=E8=A7=86=E9=A2=91=E9=A2=84=E8=A7=88=E6=94=B9=E4=B8=BA=E5=9B=BA?=
 =?UTF-8?q?=E5=AE=9A=E6=AF=94=E4=BE=8B=E5=AE=B9=E5=99=A8=E9=98=B2=E6=AD=A2?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80=E8=A2=AB=E6=92=91=E5=BC=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/static/public/css/video.css | 26 ++++++++++++++++++++++++--
 app/static/public/js/video.js   |  3 +++
 2 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/app/static/public/css/video.css b/app/static/public/css/video.css
index 3d2822a..e5522ca 100644
--- a/app/static/public/css/video.css
+++ b/app/static/public/css/video.css
@@ -1066,32 +1066,54 @@ html[data-theme='dark'] .cache-video-item.is-active .cache-video-thumb-wrap {
   }
 
   .edit-preview-wrap {
-    height: min(52vh, 360px);
+    position: relative;
+    width: min(100%, 420px);
+    margin-left: auto;
+    margin-right: auto;
+    height: auto;
+    aspect-ratio: 9 / 16;
     max-height: min(52vh, 360px);
     display: flex;
     align-items: center;
     justify-content: center;
+    contain: layout paint style;
+    -webkit-transform: translateZ(0);
+    transform: translateZ(0);
   }
 
   #editVideo {
+    position: absolute;
+    inset: 0;
     width: 100%;
     height: 100%;
     max-height: min(52vh, 360px);
+    object-fit: contain;
   }
 
   .manual-merge-col .edit-preview-wrap {
-    height: min(40vh, 280px);
+    position: relative;
+    width: min(100%, 420px);
+    margin-left: auto;
+    margin-right: auto;
+    height: auto;
+    aspect-ratio: 9 / 16;
     max-height: min(40vh, 280px);
     display: flex;
     align-items: center;
     justify-content: center;
+    contain: layout paint style;
+    -webkit-transform: translateZ(0);
+    transform: translateZ(0);
   }
 
   #mergeVideoPreviewA,
   #mergeVideoPreviewB {
+    position: absolute;
+    inset: 0;
     width: 100%;
     height: 100%;
     max-height: min(40vh, 280px);
+    object-fit: contain;
   }
 
   .manual-merge-grid {
diff --git a/app/static/public/js/video.js b/app/static/public/js/video.js
index e278f49..22c9ac3 100644
--- a/app/static/public/js/video.js
+++ b/app/static/public/js/video.js
@@ -128,6 +128,9 @@
     videoEl.setAttribute('playsinline', '');
     videoEl.setAttribute('webkit-playsinline', '');
     videoEl.setAttribute('x5-playsinline', 'true');
+    videoEl.style.objectFit = 'contain';
+    videoEl.style.maxWidth = '100%';
+    videoEl.style.maxHeight = '100%';
   }
 
   function shortHash(value) {