From 44058c24aa2cf239264df1cf8c2b4073b829578b Mon Sep 17 00:00:00 2001
From: Ginger Wong <omqmail@gmail.com>
Date: Mon, 15 Jun 2020 16:23:39 -0700
Subject: [PATCH] =?UTF-8?q?=E2=8F=B1=F0=9F=9B=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 webroot/js/message.js     |  6 +++---
 webroot/styles/layout.css | 17 +++++++++--------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/webroot/js/message.js b/webroot/js/message.js
index 5281be2f3..29b5a2ad5 100644
--- a/webroot/js/message.js
+++ b/webroot/js/message.js
@@ -72,7 +72,7 @@ class Messaging {
 		this.inputChangeUserName.addEventListener("keydown", this.handleUsernameKeydown.bind(this));
 		this.formMessageInput.addEventListener("keydown", this.handleMessageInputKeydown.bind(this));
 		this.btnSubmitMessage.addEventListener("click", this.handleSubmitChatButton.bind(this));
-		if (isAndroidMobile && window.screen.width <= 860) {
+		if (hasTouchScreen) {
 			this.formMessageInput.addEventListener("focus", this.handleKeyboardAppear.bind(this));
 			this.formMessageInput.addEventListener("blur", this.handleKeyboardOut.bind(this));
 		}
@@ -98,11 +98,11 @@ class Messaging {
 	}
 
 	handleKeyboardAppear() {
-		this.tagAppContainer.classList.add("android-message-focus");
+		setTimeout(() => {this.tagAppContainer.classList.add("message-input-focus");}, 50);
 		mobileVHhack();
 	}
 	handleKeyboardOut() {
-		this.tagAppContainer.classList.remove("android-message-focus");
+		setTimeout(() => {this.tagAppContainer.classList.remove("message-input-focus");}, 50);
 		mobileVHhack();
 	}
 
diff --git a/webroot/styles/layout.css b/webroot/styles/layout.css
index 02ddeadcb..6292a929c 100644
--- a/webroot/styles/layout.css
+++ b/webroot/styles/layout.css
@@ -329,39 +329,40 @@ header h1 {
 }
 
 
-.android-message-focus  #main-content-container {
+.message-input-focus  #main-content-container {
   flex-direction: column;
   justify-content: space-between;
   height: calc((var(--vh, 1vh) * 100) - var(--header-height));
 
 }
 
-.android-message-focus .main-cols {
+.message-input-focus .main-cols {
   width: 100vw;
 }
-.android-message-focus .left-col {
+.message-input-focus .left-col {
   flex-direction: column;
   justify-content: stretch;
   z-index: 100;
 }
-.android-message-focus .right-col {
+.message-input-focus .right-col {
   overflow: hidden;
 }
 
-.android-message-focus  #user-info {
+.message-input-focus  #user-info {
   width: 9em;    
 }
-.android-message-focus  #user-content {
+.message-input-focus  #user-content {
   display: none;
 }
-.android-message-focus  #chat-container {
+.message-input-focus  #chat-container {
   width: 100%;
   height: 100%;
   position: relative;
   height: auto;
+  z-index: 999;
 }
 
-.android-message-focus  .owncast-video-container {
+.message-input-focus  .owncast-video-container {
   height: 40vh;
   height: calc((var(--vh, 1vh) * 40));
   min-height: 300px;