[mirotalksfu] - improve VideoAI settings UI

public/css/Room.css

@@ -1421,12 +1421,16 @@ hr {
 --------------------------------------------------------------*/
 
 .avatarsVideoAI {
-    min-height: 480px;
-    max-height: 600px;
-    color: white;
-    overflow: auto;
+    position: absolute;
+    top: 0;
+    left: 0;
+    padding: 10px;
+    width: 100%;
+    /* height: 100%; */
+    color: #ffffff;
     justify-content: center; /* Center horizontally */
     align-items: center; /* Center vertically */
+    overflow: auto;
 }
 
 .container-flex {
@@ -1437,26 +1441,25 @@ hr {
 /* Custom avatar audio UI */
 
 #audio-container {
-    background: var(--select-bg);
+    margin-top: 10px;
     color: #fff;
-    padding: 10px;
     border-radius: 5px;
 }
 
 #audio-container audio {
-    width: 100%;
+    width: 320px;
     outline: none;
 }
 
 #audio-container audio::-webkit-media-controls-panel {
     background: var(--body-bg);
-    border-radius: 5px;
     padding: 5px;
 }
 
 #audio-container audio::-webkit-media-controls-timeline {
     background: var(--body-bg);
     border-radius: 5px;
+    margin: 5px;
 }
 
 /* Styling for the audio volume controls */
@@ -1485,6 +1488,10 @@ hr {
     color: #fff;
 }
 
+#avatarVideoAIStart {
+    margin-bottom: 5px;
+}
+
 /*
 z-index:
     - 1 videoMediaContainer