From 6eec8da6570dbc5d00c25b4efa5bcd75c984822e Mon Sep 17 00:00:00 2001
From: BotMaster3000 <jdgebauer@gmx.de>
Date: Mon, 7 Jun 2021 20:15:10 +0200
Subject: [PATCH 1/2] Set the Max-Width of the Chat-Window to 80%

Too long single-line messages can cause the ChatUser-Panel to disappear.
Allowing the windows of the Chat to be only 80% of width will cause a automatic linebreak in such a case.
---
 cli/onionshare_cli/resources/static/css/style.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/cli/onionshare_cli/resources/static/css/style.css b/cli/onionshare_cli/resources/static/css/style.css
index 57b23fdb..4805a3f2 100644
--- a/cli/onionshare_cli/resources/static/css/style.css
+++ b/cli/onionshare_cli/resources/static/css/style.css
@@ -202,6 +202,7 @@ ul.breadcrumbs li a:link, ul.breadcrumbs li a:visited {
 }
 
 .chat-wrapper {
+  max-width: 80%;
   display: flex;
   flex-direction: column;
   flex: 1;

From f7a5852300c205b936277663be64f40ab426ff62 Mon Sep 17 00:00:00 2001
From: BotMaster3000 <jdgebauer@gmx.de>
Date: Mon, 7 Jun 2021 22:29:40 +0200
Subject: [PATCH 2/2] Set the word-break to break-word for the message-class,
 and removed the max-width again

As said by SaptakS, I applied the word-break to the message-Class. Since this breaks the line for long words without Spaces, as well as longer sentences, this is the better solution.
Since the max-width now is redundant, it got removed again, as to not cause any future confusion.
---
 cli/onionshare_cli/resources/static/css/style.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/cli/onionshare_cli/resources/static/css/style.css b/cli/onionshare_cli/resources/static/css/style.css
index 4805a3f2..7cec9738 100644
--- a/cli/onionshare_cli/resources/static/css/style.css
+++ b/cli/onionshare_cli/resources/static/css/style.css
@@ -202,7 +202,6 @@ ul.breadcrumbs li a:link, ul.breadcrumbs li a:visited {
 }
 
 .chat-wrapper {
-  max-width: 80%;
   display: flex;
   flex-direction: column;
   flex: 1;
@@ -230,6 +229,7 @@ ul.breadcrumbs li a:link, ul.breadcrumbs li a:visited {
   display: block;
 }
 .chat-wrapper .message {
+  word-break: break-word;
   font-weight: normal;
   display: block;
   margin-bottom: 0.3em;