From 627031bfd95066c555b55f95062e536b4a66c002 Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Sun, 19 Jun 2022 20:15:33 +0200
Subject: [PATCH] [mirotalk] - UI

---
 public/css/client.css | 4 ++--
 public/js/client.js   | 5 +++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/public/css/client.css b/public/css/client.css
index 7ebbf715..b31c8199 100755
--- a/public/css/client.css
+++ b/public/css/client.css
@@ -119,7 +119,7 @@ body {
     height: 100%;
     margin: auto;
     overflow: hidden;
-    background: var(--body-bg);
+    background: url('../images/bg.svg');
 }
 
 /*--------------------------------------------------------------
@@ -142,7 +142,7 @@ body {
     color: #fff;
     padding: 30px;
     border-radius: 10px;
-    background: var(--body-bg);
+    background: rgba(0, 0, 0, 0.7);
 }
 #loadingDiv h1 {
     font-size: 60px;
diff --git a/public/js/client.js b/public/js/client.js
index ab42617c..491a1688 100644
--- a/public/js/client.js
+++ b/public/js/client.js
@@ -634,8 +634,6 @@ function countPeerConnections() {
  * On body load Get started
  */
 function initClientPeer() {
-    setTheme(mirotalkTheme);
-
     if (!isWebRTCSupported) {
         userLog('error', 'This browser seems not supported WebRTC!');
         return;
@@ -810,6 +808,7 @@ function whoAreYouJoin() {
     setPeerAvatarImgName('myVideoAvatarImage', myPeerName);
     setPeerChatAvatarImgName('right', myPeerName);
     joinToChannel();
+    setTheme(mirotalkTheme);
 }
 
 /**
@@ -1182,6 +1181,7 @@ function setTheme(theme) {
             document.documentElement.style.setProperty('--left-msg-bg', '#222328');
             document.documentElement.style.setProperty('--private-msg-bg', '#f77070');
             document.documentElement.style.setProperty('--right-msg-bg', '#0a0b0c');
+            document.body.style.background = 'radial-gradient(#393939, #000000)';
             break;
         case 'grey':
             // grey theme
@@ -1194,6 +1194,7 @@ function setTheme(theme) {
             document.documentElement.style.setProperty('--left-msg-bg', '#222328');
             document.documentElement.style.setProperty('--private-msg-bg', '#f77070');
             document.documentElement.style.setProperty('--right-msg-bg', '#0a0b0c');
+            document.body.style.background = 'radial-gradient(#666, #333)';
             break;
         // ...
         default: