[mirotalkbro] - improve css

miroslavpejic85 · Jan 20, 2025 · fd1fa26 · fd1fa26
1 parent e1c2a13
commit fd1fa26
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 7 deletions.
diff --git a/public/css/common.css b/public/css/common.css
@@ -308,12 +308,9 @@ td button:hover {
     align-items: center;
 }
 
-.overlay {
+.awaiting-broadcaster {
     z-index: 1;
     position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
     width: 100%;
     color: white;
     font-size: 18px;

diff --git a/public/js/viewer.js b/public/js/viewer.js
@@ -10,7 +10,7 @@ console.log('Viewer', {
 
 const body = document.querySelector('body');
 
-const waitingBroadcaster = document.getElementById('waitingBroadcaster');
+const awaitingBroadcaster = document.getElementById('awaitingBroadcaster');
 const viewerForm = document.getElementById('viewerForm');
 const viewerFormHeader = document.getElementById('viewerFormHeader');
 const viewerButtons = document.getElementById('viewerButtons');
@@ -122,7 +122,7 @@ socket.on('offer', async (id, description, iceServers) => {
     peerConnection.ontrack = (event) => {
         saveRecording();
         attachStream(event.streams[0]);
-        hideElement(waitingBroadcaster);
+        hideElement(awaitingBroadcaster);
     };
 
     peerConnection.onicecandidate = (event) => {

diff --git a/public/views/viewer.html b/public/views/viewer.html
@@ -34,7 +34,9 @@
                 <div class="video-off">
                     <img id="videoOff" class="video-off" src="../assets/images/videoOff.png" />
                 </div>
-                <div id="waitingBroadcaster" class="overlay pulse">Awaiting the broadcaster...</div>
+                <div id="awaitingBroadcaster" class="awaiting-broadcaster center pulse">
+                    Awaiting the broadcaster...
+                </div>
             </div>
             <label id="recordingLabel" class="pulse">🔴 REC: <span id="recordingTime">0S</span></label>
             <div id="viewerButtons" class="viewer-buttons">