From 4a4200b1796ee842eab05e6b662eb33ecaa18ec5 Mon Sep 17 00:00:00 2001
From: kckckc <kckckcdev@gmail.com>
Date: Thu, 12 May 2022 01:35:07 -0700
Subject: [PATCH] fix #1939: Fix chat styles on mobile

---
 src/client/ui/templates/messages/mobile.js   |  4 +++-
 src/client/ui/templates/messages/styles.less | 11 +++++++++--
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/client/ui/templates/messages/mobile.js b/src/client/ui/templates/messages/mobile.js
index 69fa0a79..b404e20d 100644
--- a/src/client/ui/templates/messages/mobile.js
+++ b/src/client/ui/templates/messages/mobile.js
@@ -7,8 +7,10 @@ define([
 		renderKeyboard: function () {
 			this.find('.keyboard').remove();
 
+			let mainContainer = this.find('.main');
+
 			let container = $('<div class="keyboard"></div>')
-				.appendTo(this.el);
+				.appendTo(mainContainer);
 
 			let keyboard = {
 				0: 'qwertyuiop|asdfghjkl|zxcvbnm',
diff --git a/src/client/ui/templates/messages/styles.less b/src/client/ui/templates/messages/styles.less
index 6334ab13..96818e44 100644
--- a/src/client/ui/templates/messages/styles.less
+++ b/src/client/ui/templates/messages/styles.less
@@ -318,13 +318,20 @@
 	&.typing {
 		left: 0px;
 		top: 0px;
-		width: 100%;
-		height: 100%;
+		width: 100vw;
+		height: 100vh;
 		background-color: fade(@blackC, 90%);
 		display: flex;
 		flex-direction: column;
 		z-index: 999999998;
 
+		.main {
+			display: flex;
+			flex-direction: column;
+			flex-grow: 1;
+			min-height: 0px;
+		}
+
 		.channelPicker {
 			display: none;
 		}