From 69bb007a2d41359bc82197858ff4e7952c8059e4 Mon Sep 17 00:00:00 2001
From: Chen-I Lim <chenilim@gmail.com>
Date: Sun, 8 Oct 2023 18:06:11 -0700
Subject: [PATCH 1/3] Add padding and margins to replay display elements

---
 online_log/static/replay.html      | 4 ++--
 online_log/static/replay/js/app.js | 8 ++++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/online_log/static/replay.html b/online_log/static/replay.html
index 6fcecb98..1006c938 100644
--- a/online_log/static/replay.html
+++ b/online_log/static/replay.html
@@ -34,8 +34,8 @@
         </div>
     </div>
     <div id="show" style="display: grid;">
-        
-        <div id="humanRequest" style="position: relative; overflow: auto;">
+
+        <div id="humanRequest" style="position: relative; overflow: auto; padding: 0 10px">
             <p id="Requesttext" style=" color:aliceblue; display: block;font-weight: 900; max-height: 18px; max-width: 800px;">Task: </p>
         </div>
         <div id="dialogBody" style="top:20px;display: flex;flex-direction: column;">
diff --git a/online_log/static/replay/js/app.js b/online_log/static/replay/js/app.js
index 9d7d060b..3e2dd109 100644
--- a/online_log/static/replay/js/app.js
+++ b/online_log/static/replay/js/app.js
@@ -207,7 +207,7 @@ function watchfileInput(files) {
     }
 }
 
-//extract information 
+//extract information
 function extraction(contents) {
     const regex = /\[(\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2} \w+)\] ([.\s\S\n\r\d\D\t]*?)(?=\n\[\d|$)/g;
 
@@ -381,7 +381,7 @@ function extraction(contents) {
     return dialog;
 }
 
-//show dailog 
+//show dailog
 function createPara(d, i) {
     const singleDialog = document.createElement("div");
     singleDialog.style.position = "relative";
@@ -399,6 +399,9 @@ function createPara(d, i) {
 
         character.style.backgroundColor = "lightblue";
         character.style.width = "fit-content";
+        character.style.padding = "5px 20px";
+        character.style.marginBottom = "5px";
+        character.style.width = "fit-content";
         character.style.fontSize = "13px ";
         character.style.border = "1px solid rgba(11, 20, 150, .3)";
         character.style.borderRadius = "10px";
@@ -441,6 +444,7 @@ function createPara(d, i) {
         characterimg.style.height = "40px";
         characterimg.style.width = "30px";
         characterimg.style.position = "relative";
+		characterimg.style.marginLeft = "10px";
         character.appendChild(characterimg);
         character.style.width = "fit-content";
 

From b00444ca5830b5ab833cc32a175e26627c2076a3 Mon Sep 17 00:00:00 2001
From: Chen-I Lim <chenilim@gmail.com>
Date: Sun, 8 Oct 2023 18:30:40 -0700
Subject: [PATCH 2/3] Fix tabs

---
 online_log/static/replay/js/app.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/online_log/static/replay/js/app.js b/online_log/static/replay/js/app.js
index 3e2dd109..18aeb3f9 100644
--- a/online_log/static/replay/js/app.js
+++ b/online_log/static/replay/js/app.js
@@ -444,7 +444,7 @@ function createPara(d, i) {
         characterimg.style.height = "40px";
         characterimg.style.width = "30px";
         characterimg.style.position = "relative";
-		characterimg.style.marginLeft = "10px";
+        characterimg.style.marginLeft = "10px";
         character.appendChild(characterimg);
         character.style.width = "fit-content";
 

From a0f31b33dda7001a1bb1484daaac7fff8982f153 Mon Sep 17 00:00:00 2001
From: Chen-I Lim <chenilim@gmail.com>
Date: Sun, 8 Oct 2023 18:32:43 -0700
Subject: [PATCH 3/3] Fix repest

---
 online_log/static/replay/js/app.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/online_log/static/replay/js/app.js b/online_log/static/replay/js/app.js
index 18aeb3f9..9d689d37 100644
--- a/online_log/static/replay/js/app.js
+++ b/online_log/static/replay/js/app.js
@@ -401,7 +401,6 @@ function createPara(d, i) {
         character.style.width = "fit-content";
         character.style.padding = "5px 20px";
         character.style.marginBottom = "5px";
-        character.style.width = "fit-content";
         character.style.fontSize = "13px ";
         character.style.border = "1px solid rgba(11, 20, 150, .3)";
         character.style.borderRadius = "10px";