fix: 优化

src/views/home/index.vue

@@ -323,25 +323,21 @@ function joinRoom(data: { roomId: number }) {
         }
         :deep(canvas) {
           position: absolute;
-          top: 0;
+          top: 50%;
           left: 50%;
           max-width: $w-1100;
           max-height: calc($w-1100 / $video-ratio);
-          width: 100%;
-          height: 100%;
-          transform: translate(-50%);
+          transform: translate(-50%, -50%);
 
           user-select: none;
         }
         :deep(video) {
           position: absolute;
-          top: 0;
+          top: 50%;
           left: 50%;
           max-width: $w-1100;
           max-height: calc($w-1100 / $video-ratio);
-          width: 100%;
-          height: 100%;
-          transform: translate(-50%);
+          transform: translate(-50%, -50%);
 
           user-select: none;
         }

src/views/pull/index.vue

@@ -392,20 +392,30 @@ watch(
         }
         .media-list {
           position: relative;
-
+          height: 562px;
           :deep(video) {
+            position: absolute;
+            top: 50%;
+            left: 50%;
             display: block;
-            width: 100%;
-            height: 100%;
+            // width: 100%;
+            // height: 100%;
+            margin: 0 auto;
             max-width: $w-1000;
             max-height: 562px;
+            transform: translate(-50%, -50%);
           }
           :deep(canvas) {
+            position: absolute;
+            top: 50%;
+            left: 50%;
             display: block;
-            width: 100%;
-            height: 100%;
+            // width: 100%;
+            // height: 100%;
+            margin: 0 auto;
             max-width: $w-1000;
             max-height: 562px;
+            transform: translate(-50%, -50%);
           }
           // &.item {
           //   :deep(video) {