Fixed replied chat message size #924

Author: devopvoid

src/component/chat-box/chat-message.css

@@ -49,7 +49,7 @@ pre {
 	border-radius: 5px;
 	margin: 0 0 0 auto;
 	width: 100%;
-	padding: 0 0.3rem;
+	padding: 0.3rem;
 }
 .reply-message-header {
 	font-weight: bold;

src/component/chat-box/chat-message.ts

@@ -88,10 +88,10 @@ export class ChatBoxMessage extends Component {
 				<div class="chat-message-boxed">
 					${when(this.editing, () => html`
 						<div class="chat-message-edit">
-				    		    <textarea
-									@input="${(e: InputEvent) => this.editedText = (e.target as HTMLTextAreaElement).value}"
-									.value="${this.editedText}" id="edit-message-textarea">
-							    </textarea>
+							<textarea
+								@input="${(e: InputEvent) => this.editedText = (e.target as HTMLTextAreaElement).value}"
+								.value="${this.editedText}" id="edit-message-textarea">
+							</textarea>
 							<sl-button id="message-submit" slot="right-pane" @click="${this.postEditedMessage}"
 									   type="submit" form="course-message-form" size="medium" circle>
 								<sl-icon name="send"></sl-icon>

src/component/chat-form/chat-form.css

@@ -43,6 +43,7 @@ form pre {
 	padding: 0;
 	font-family: inherit;
 	font-size: small;
+	white-space: pre-wrap;
 }
 
 form .reply-message-container {