feat: video layout

Author: wkylin

src/components/stateless/SmartVideoPlayer/index.jsx

@@ -142,6 +142,16 @@ const SmartVideoPlayer = ({
 
         const name = typeof err?.name === 'string' ? err.name : 'PlayError'
         const message = typeof err?.message === 'string' ? err.message : ''
+
+        // Common & harmless: play() interrupted by pause() (e.g. IO lazy-play or rapid user toggles)
+        if (
+          name === 'AbortError' ||
+          /interrupted by a call to pause\(\)/i.test(message) ||
+          /The play\(\) request was interrupted/i.test(message)
+        ) {
+          return
+        }
+
         setPlayError(message ? `无法播放：${name} - ${message}` : `无法播放：${name}`)
       })
   }, [])

src/pages/video/index.module.css

@@ -1,5 +1,5 @@
 .page {
-  padding: 24px;
+  padding: 16px;
   width: 100%;
   display: flex;
   justify-content: center;
@@ -8,10 +8,8 @@
 
 .card {
   width: 100%;
-  max-width: 40vw;
-  border: 1px solid rgba(0, 0, 0, 0.08);
+  max-width: 960px;
   border-radius: 16px;
-  background: #fff;
   overflow: hidden;
 }
 
@@ -45,6 +43,25 @@
   white-space: nowrap;
 }
 
+@media (max-width: 640px) {
+  .page {
+    padding: 0;
+  }
+
+  .card {
+    max-width: 100%;
+    border-radius: 0;
+  }
+
+  .header {
+    padding: 12px 12px 10px;
+  }
+
+  .subTitle {
+    max-width: 70vw;
+  }
+}
+
 .actions {
   display: flex;
   flex-wrap: wrap;