Browse Source

⏱🛠

pull/5/head
Ginger Wong 5 years ago
parent
commit
44058c24aa
  1. 6
      webroot/js/message.js
  2. 17
      webroot/styles/layout.css

6
webroot/js/message.js

@ -72,7 +72,7 @@ class Messaging {
this.inputChangeUserName.addEventListener("keydown", this.handleUsernameKeydown.bind(this)); this.inputChangeUserName.addEventListener("keydown", this.handleUsernameKeydown.bind(this));
this.formMessageInput.addEventListener("keydown", this.handleMessageInputKeydown.bind(this)); this.formMessageInput.addEventListener("keydown", this.handleMessageInputKeydown.bind(this));
this.btnSubmitMessage.addEventListener("click", this.handleSubmitChatButton.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("focus", this.handleKeyboardAppear.bind(this));
this.formMessageInput.addEventListener("blur", this.handleKeyboardOut.bind(this)); this.formMessageInput.addEventListener("blur", this.handleKeyboardOut.bind(this));
} }
@ -98,11 +98,11 @@ class Messaging {
} }
handleKeyboardAppear() { handleKeyboardAppear() {
this.tagAppContainer.classList.add("android-message-focus"); setTimeout(() => {this.tagAppContainer.classList.add("message-input-focus");}, 50);
mobileVHhack(); mobileVHhack();
} }
handleKeyboardOut() { handleKeyboardOut() {
this.tagAppContainer.classList.remove("android-message-focus"); setTimeout(() => {this.tagAppContainer.classList.remove("message-input-focus");}, 50);
mobileVHhack(); mobileVHhack();
} }

17
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; flex-direction: column;
justify-content: space-between; justify-content: space-between;
height: calc((var(--vh, 1vh) * 100) - var(--header-height)); height: calc((var(--vh, 1vh) * 100) - var(--header-height));
} }
.android-message-focus .main-cols { .message-input-focus .main-cols {
width: 100vw; width: 100vw;
} }
.android-message-focus .left-col { .message-input-focus .left-col {
flex-direction: column; flex-direction: column;
justify-content: stretch; justify-content: stretch;
z-index: 100; z-index: 100;
} }
.android-message-focus .right-col { .message-input-focus .right-col {
overflow: hidden; overflow: hidden;
} }
.android-message-focus #user-info { .message-input-focus #user-info {
width: 9em; width: 9em;
} }
.android-message-focus #user-content { .message-input-focus #user-content {
display: none; display: none;
} }
.android-message-focus #chat-container { .message-input-focus #chat-container {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
height: auto; height: auto;
z-index: 999;
} }
.android-message-focus .owncast-video-container { .message-input-focus .owncast-video-container {
height: 40vh; height: 40vh;
height: calc((var(--vh, 1vh) * 40)); height: calc((var(--vh, 1vh) * 40));
min-height: 300px; min-height: 300px;

Loading…
Cancel
Save