From 986fba8b76d4aa12a61f49aaa9a2aba273c0d9e7 Mon Sep 17 00:00:00 2001
From: lindenkron <lindenkron@hotmail.com>
Date: Sun, 16 Apr 2023 17:06:46 +0200
Subject: [PATCH 1/3] Popout

---
 main.css    |  1 -
 popout.html | 70 ++++++++++++++++++++++++++++++++++++++++++-----------
 2 files changed, 56 insertions(+), 15 deletions(-)

diff --git a/main.css b/main.css
index c4fd53e..f09d768 100644
--- a/main.css
+++ b/main.css
@@ -3384,7 +3384,6 @@ div#chatBody a {
 #chatModule {
     display: flex;
     flex-wrap: wrap;
-    z-index: 3;
     width: 100%;
     max-width: 500px;
     z-index: 3;
diff --git a/popout.html b/popout.html
index 91f5378..3d919a2 100644
--- a/popout.html
+++ b/popout.html
@@ -4,32 +4,74 @@
 <link rel="stylesheet" href="./main.css?ver=22" />
 <style>
 #chatModule{
-    bottom: 0px;
-    position: fixed;
+    display: flex;
+    flex-wrap: wrap;
     align-self: center;
+    z-index: 3;
+    margin-bottom: unset;
     width: 100%;
+    max-width: unset !important;
+    gap: 0px 5px;
+	pointer-events: auto;
+    gap: 5px;
+    height: calc(100% - 25px);
 }
-#chatInput{
-    color: #000;
-    background-color: #FFFE;
-    max-width: 700px;
-    min-width: 390px;
-    font-size: 105%;
-    margin-left: 10px;
-    padding: 3px;
+#chatModule {
+    display: flex;
+    flex-wrap: wrap;
+    z-index: 3;
+    width: 100%;
+    max-width: 500px;
+    z-index: 3;
+    margin-bottom: 65px;
+    gap: 0px 5px;
+	pointer-events: auto;
+    margin-bottom: unset !important;
+    margin: 5px;
 }
 #chatBody {
+    display: flex;
+    flex-direction: column;
     z-index: 12;
     background-color: #0000;
+    border-bottom: 5px #121212 solid;
     width: 100%;
+    height: 100%;
     border-radius: 5px;
-    padding: 1px 7px;
+    gap: 5px;
     overflow-y: scroll;
     overflow-wrap: anywhere;
-    max-height: 800px;
+    height: calc(100% - 25px);
+    max-height: unset;
+}
+#chatInput{
+    color: #ccc;
+    background-color: #404249;
+    padding: 7px 10px 6px 6px;
+    flex: 3;
+    max-height: 25px;
+}
+.outMessage {
+    margin-bottom: unset;
+}
+::-webkit-input-placeholder {
+	color: #ccc !important;
 }
 body{
-	background-color:#EEE;
+    background-color: #121212;
+    justify-content: center;
+    flex-flow: unset;
+}
+
+button {
+    -webkit-app-region: no-drag;
+    user-select: none;
+    cursor: pointer;
+    border-radius: 4px;
+    flex: 1;
+    margin: unset;
+    padding: 7px 10px 6px 6px;
+    max-height: 25px;
 }
 </style>
 </head>
@@ -41,7 +83,7 @@ body{
 		</div>
 	</div>
 	<input id="chatInput" placeholder="Enter chat message to send here" onkeypress="EnterButtonChat(event)" />
-	<button style="width:60px;background-color:#ACA;" onclick="sendChatMessage()" data-translate='send-chat'>Send</button>
+	<button style="background-color:#fff;" onclick="sendChatMessage()" data-translate='send-chat'>Send</button>
 </div>
 <script>
 

From ebc8370a594fb0ec5d96da0c2aa33ce60358b5e1 Mon Sep 17 00:00:00 2001
From: lindenkron <lindenkron@hotmail.com>
Date: Sun, 16 Apr 2023 17:09:50 +0200
Subject: [PATCH 2/3] Missed two things.

---
 popout.html | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/popout.html b/popout.html
index 3d919a2..cd5225b 100644
--- a/popout.html
+++ b/popout.html
@@ -32,6 +32,7 @@
 #chatBody {
     display: flex;
     flex-direction: column;
+    justify-content: flex-end;
     z-index: 12;
     background-color: #0000;
     border-bottom: 5px #121212 solid;
@@ -50,6 +51,8 @@
     padding: 7px 10px 6px 6px;
     flex: 3;
     max-height: 25px;
+    z-index: 100;
+
 }
 .outMessage {
     margin-bottom: unset;

From fbe6feb4d4707bddb6c6c4ae954eba7cd96f7edf Mon Sep 17 00:00:00 2001
From: lindenkron <lindenkron@hotmail.com>
Date: Sun, 16 Apr 2023 17:11:08 +0200
Subject: [PATCH 3/3] button alignment.

---
 popout.html | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/popout.html b/popout.html
index cd5225b..486accf 100644
--- a/popout.html
+++ b/popout.html
@@ -67,6 +67,9 @@ body{
 }
 
 button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
     -webkit-app-region: no-drag;
     user-select: none;
     cursor: pointer;