feat(video_player): improve style of bottom bar

apps/client/src/widgets/type_widgets/file/Video.css

@@ -18,6 +18,29 @@
         display: flex;
         flex-direction: column;
         gap: 0.5em;
+        background: rgba(0, 0, 0, 0.5);
+
+        .video-buttons-row {
+            display: flex;
+
+            > * {
+                flex: 1;
+            }
+
+            .center {
+                display: flex;
+                justify-content: center;
+            }
+
+            .right {
+                display: flex;
+                justify-content: flex-end;
+            }
+
+            .play-button {
+                --icon-button-size: 48px;
+            }
+        }
     }
 
     .video-seekbar-row {
@@ -38,24 +61,6 @@
         white-space: nowrap;
     }
 
-    .video-buttons-row {
-        display: flex;
-
-        > * {
-            flex: 1;
-        }
-
-        .center {
-            display: flex;
-            justify-content: center;
-        }
-
-        .right {
-            display: flex;
-            justify-content: flex-end;
-        }
-    }
-
     .video-volume-row {
         display: flex;
         align-items: center;

apps/client/src/widgets/type_widgets/file/Video.tsx

@@ -45,6 +45,7 @@ export default function VideoPreview({ note }: { note: FNote }) {
                     <div className="left" />
                     <div className="center">
                         <ActionButton
+                            className="play-button"
                             icon={playing ? "bx bx-pause" : "bx bx-play"}
                             text={playing ? "Pause" : "Play"}
                             onClick={togglePlayback}