From 18f6afa7b1f329c07a4856a5e20bbf137765327c Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Sun, 16 Jan 2022 13:05:35 +0100
Subject: [PATCH] [mirotalk] - improve send private msg UI

---
 public/css/client.css   | 17 +++++++----------
 public/view/client.html |  2 +-
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/public/css/client.css b/public/css/client.css
index 80d4f5fb..00f9042b 100755
--- a/public/css/client.css
+++ b/public/css/client.css
@@ -679,6 +679,7 @@ button:hover {
 
 #msgerVideoUrlBtn,
 #msgerEmojiBtn,
+#msgerCPBtn,
 #msgerSendBtn {
     background: rgb(0, 0, 0);
     color: #fff;
@@ -687,6 +688,7 @@ button:hover {
 
 #msgerVideoUrlBtn:hover,
 #msgerEmojiBtn:hover,
+#msgerCPBtn:hover,
 #msgerSendBtn:hover {
     color: var(--hover-color);
     transform: var(--btns-hover-scale);
@@ -700,17 +702,12 @@ button:hover {
 #msgerCP {
     z-index: 11;
     display: none;
-    cursor: default;
-    top: var(--msger-top);
-    left: var(--msger-left);
-    height: var(--msger-height);
-    width: var(--msger-width);
-    background: var(--msger-private-bg);
-    /* center */
     position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
+    bottom: 55px;
+    width: 100%;
+    height: 50%;
+    cursor: default;
+    background: var(--msger-private-bg);
     /* fade in */
     -webkit-animation: fadeIn ease-in 1;
     -moz-animation: fadeIn ease-in 1;
diff --git a/public/view/client.html b/public/view/client.html
index 3f26e937..fd0431be 100755
--- a/public/view/client.html
+++ b/public/view/client.html
@@ -109,7 +109,6 @@ access to use this app.
                     <div class="msger-header-title"><i class="fas fa-comment-alt"></i> Chat</div>
                     <div class="msger-header-options">
                         <button id="msgerTheme" class="fas fa-ghost"></button>
-                        <button id="msgerCPBtn" class="fas fa-users"></button>
                         <button id="msgerClean" class="fas fa-trash"></button>
                         <button id="msgerSaveBtn" class="fas fa-save"></button>
                         <button id="msgerClose" class="fas fa-times"></button>
@@ -133,6 +132,7 @@ access to use this app.
                     <input id="msgerInput" class="msger-input" type="text" placeholder="💬 Enter your message..." />
                     <button id="msgerVideoUrlBtn" class="fab fa-youtube"></button>
                     <button id="msgerEmojiBtn" class="fas fa-smile"></button>
+                    <button id="msgerCPBtn" class="fas fa-users"></button>
                     <button id="msgerSendBtn" class="fas fa-paper-plane"></button>
                 </div>
             </section>