From 84209c3ff31cfad03179f191413eb9cec6d3aaf7 Mon Sep 17 00:00:00 2001
From: Jean-Baptiste Pasquier <contact@jbpasquier.eu>
Date: Mon, 30 Nov 2020 18:10:09 +0100
Subject: [PATCH] fix: chatbox height

---
 src/scripts/firefox-scroll.js        | 12 ++++++++----
 src/styles/layout/user/messages.scss |  5 ++++-
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/scripts/firefox-scroll.js b/src/scripts/firefox-scroll.js
index 5f62468..8f78178 100644
--- a/src/scripts/firefox-scroll.js
+++ b/src/scripts/firefox-scroll.js
@@ -18,8 +18,10 @@ document.addEventListener("DOMContentLoaded", () => {
             let viewportChat = Array.from(
               document.querySelectorAll("#viewport .chat-view")
             );
+            let headerOffset = document.querySelector('#header').offsetHeight;
+            let intermediateOffset = Array.from(document.querySelectorAll(".content-box__header")).filter(el=>el.offsetParent!==null?el:null)[0].offsetHeight;
             viewportChat.forEach(
-              (c) => (c.style.height = "calc(100vh - 106px - 57px - 4px)")
+              (c) => (c.style.height = "calc(100vh - "+String(headerOffset+intermediateOffset)+"px)") // Firefox keyboard 57px
             );
           }
         }
@@ -33,7 +35,7 @@ document.addEventListener("DOMContentLoaded", () => {
       clearInterval(isbody);
       resizeChat();
     }
-  }, 15);
+  }, 50);
 
   window.addEventListener("load", () => {
     setTimeout(() => {
@@ -41,10 +43,12 @@ document.addEventListener("DOMContentLoaded", () => {
     }, 0);
   });
 
+  let windowResizing;
   window.addEventListener("resize", () => {
-    setTimeout(() => {
+    windowResizing = setTimeout(() => {
+      clearInterval(windowResizing);
       resizeChat();
-    }, 0);
+    }, 50);
   });
 
   document.addEventListener("navigate", () => {
diff --git a/src/styles/layout/user/messages.scss b/src/styles/layout/user/messages.scss
index f0ae1ec..db9e071 100644
--- a/src/styles/layout/user/messages.scss
+++ b/src/styles/layout/user/messages.scss
@@ -9,5 +9,8 @@
 }
 .avatar-text {
   position: absolute;
-  top: 2.8rem;
+  top: 7.5rem;
+  @include breakpoint(lg) {
+    top: 2.8rem;
+  }
 }
\ No newline at end of file