From 5a4a20ad4b1eb4043345747f3d522365b3f7be10 Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Thu, 18 Jul 2024 15:25:05 +0200
Subject: [PATCH] [mirotalksfu] - improve real-time poll UI

---
 app/src/Server.js       |  2 +-
 package.json            |  2 +-
 public/css/Polls.css    | 11 +++++++--
 public/js/Room.js       |  4 ++--
 public/js/RoomClient.js |  2 +-
 public/views/Room.html  | 50 +++++++++++++++++++++--------------------
 6 files changed, 40 insertions(+), 31 deletions(-)

diff --git a/app/src/Server.js b/app/src/Server.js
index 630e6c88..8dc3408b 100644
--- a/app/src/Server.js
+++ b/app/src/Server.js
@@ -44,7 +44,7 @@ dependencies: {
  * @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.5.13
+ * @version 1.5.14
  *
  */
 
diff --git a/package.json b/package.json
index 31127109..7ac779c6 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalksfu",
-    "version": "1.5.13",
+    "version": "1.5.14",
     "description": "WebRTC SFU browser-based video calls",
     "main": "Server.js",
     "scripts": {
diff --git a/public/css/Polls.css b/public/css/Polls.css
index 6780cb6d..e61af6ed 100644
--- a/public/css/Polls.css
+++ b/public/css/Polls.css
@@ -10,7 +10,7 @@
     height: 100%;
     max-width: 600px;
     max-height: 700px;
-    overflow-x: hidden;
+    overflow: hidden;
 }
 
 .poll-header {
@@ -21,6 +21,12 @@
     cursor: move;
 }
 
+.polls {
+    width: 100%;
+    height: 100%;
+    overflow-x: hidden;
+}
+
 .poll-creation {
     border-radius: var(--border-radius);
     margin-bottom: 20px;
@@ -103,6 +109,7 @@
 
 .polls-container {
     margin-top: 20px;
+    margin-bottom: 70px;
 }
 
 .poll {
@@ -169,4 +176,4 @@
     float: right;
     right: 20px;
     font-size: 1.3rem;
-}
+}
\ No newline at end of file
diff --git a/public/js/Room.js b/public/js/Room.js
index 90c225e8..5d2d8c9e 100644
--- a/public/js/Room.js
+++ b/public/js/Room.js
@@ -11,7 +11,7 @@ if (location.href.substr(0, 5) !== 'https') location.href = 'https' + location.h
  * @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.5.13
+ * @version 1.5.14
  *
  */
 
@@ -4279,7 +4279,7 @@ function showAbout() {
         imageUrl: image.about,
         customClass: { image: 'img-about' },
         position: 'center',
-        title: 'WebRTC SFU v1.5.13',
+        title: 'WebRTC SFU v1.5.14',
         html: `
         <br />
         <div id="about">
diff --git a/public/js/RoomClient.js b/public/js/RoomClient.js
index d76fb50d..7a70a86f 100644
--- a/public/js/RoomClient.js
+++ b/public/js/RoomClient.js
@@ -9,7 +9,7 @@
  * @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.5.13
+ * @version 1.5.14
  *
  */
 
diff --git a/public/views/Room.html b/public/views/Room.html
index 101d305b..1136a429 100644
--- a/public/views/Room.html
+++ b/public/views/Room.html
@@ -1446,33 +1446,35 @@ access to use this app.
                     <button id="pollCloseBtn" class="fas fa-times"></button>
                 </div>
             </div>
-            <div id="pollForm" class="poll-creation">
-                <form id="createPollForm" class="form">
-                    <div class="form-group">
-                        <label for="question">Question:</label>
-                        <input type="text" id="question" name="question" required />
-                    </div>
-                    <div class="form-group">
-                        <label for="options">Options:</label>
-                        <div id="optionsContainer">
-                            <input type="text" name="option" class="option-input" required />
+            <div class="polls">
+                <div id="pollForm" class="poll-creation">
+                    <form id="createPollForm" class="form">
+                        <div class="form-group">
+                            <label for="question">Question:</label>
+                            <input type="text" id="question" name="question" required />
                         </div>
-                        <br />
-                        <div class="poll-btns">
-                            <button type="button" id="addOptionButton" class="poll-btn">
-                                <i class="fas fa-plus"></i>
-                            </button>
-                            <button type="button" id="delOptionButton" class="del-btn">
-                                <i class="fas fa-minus"></i>
-                            </button>
-                            <button type="submit" id="addPollButton" class="poll-btn">
-                                <i class="fas fa-square-poll-horizontal"></i> Create Poll
-                            </button>
+                        <div class="form-group">
+                            <label for="options">Options:</label>
+                            <div id="optionsContainer">
+                                <input type="text" name="option" class="option-input" required />
+                            </div>
+                            <br />
+                            <div class="poll-btns">
+                                <button type="button" id="addOptionButton" class="poll-btn">
+                                    <i class="fas fa-plus"></i>
+                                </button>
+                                <button type="button" id="delOptionButton" class="del-btn">
+                                    <i class="fas fa-minus"></i>
+                                </button>
+                                <button type="submit" id="addPollButton" class="poll-btn">
+                                    <i class="fas fa-square-poll-horizontal"></i> Create Poll
+                                </button>
+                            </div>
                         </div>
-                    </div>
-                </form>
+                    </form>
+                </div>
+                <div id="pollsContainer" class="polls-container"></div>
             </div>
-            <div id="pollsContainer" class="polls-container"></div>
         </section>
 
         <section id="transcriptionRoom" class="transcription-room fadein">