From 294dbf0509aaa0265ae06b3b8cefe9c8f4544651 Mon Sep 17 00:00:00 2001
From: morethanwords <thanwords24@gmail.com>
Date: Thu, 15 Oct 2020 21:51:55 +0300
Subject: [PATCH] Fix emojis overflow on Apple devices

---
 src/scss/partials/_chat.scss     |  4 ++--
 src/scss/partials/_chatlist.scss |  2 +-
 src/scss/style.scss              | 24 +++++++++++++-----------
 3 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/scss/partials/_chat.scss b/src/scss/partials/_chat.scss
index 4c9cff10..54749f06 100644
--- a/src/scss/partials/_chat.scss
+++ b/src/scss/partials/_chat.scss
@@ -776,10 +776,10 @@
 			vertical-align: top;
 		}
 
-		span.emoji {
+		/* span.emoji {
 			font-size: 1rem;
 			vertical-align: unset;
-		}
+		} */
 	}
 
 	.pinned-message {
diff --git a/src/scss/partials/_chatlist.scss b/src/scss/partials/_chatlist.scss
index 17189a12..525cf5b8 100644
--- a/src/scss/partials/_chatlist.scss
+++ b/src/scss/partials/_chatlist.scss
@@ -89,6 +89,7 @@
     /* grid-gap: 4px; */
     width: 100%;
 
+    user-select: none;
     -webkit-user-select: none; /* disable selection/Copy of UIWebView */
     -webkit-touch-callout: none; /* disable the IOS popup when long-press on a link */
 
@@ -216,7 +217,6 @@
     vertical-align: middle;
     //margin: .1rem 0;
     line-height: 27px;
-    user-select: none;
   }
 
   .dialog-avatar {
diff --git a/src/scss/style.scss b/src/scss/style.scss
index 66396a45..d5199b98 100644
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -1049,16 +1049,11 @@ input:focus, button:focus {
   }
 }
 
-.emoji {
-  display: inline-block;
-  /* width: 100%;
-  height: 100%; */
-  max-width: 100%;
-  max-height: 100%;
-  vertical-align: middle;
-
-  line-height: 1em;
-  font-size: 1em;
+span.emoji {
+  display: inline !important;
+  vertical-align: unset !important;
+  //line-height: 1em;
+  //font-size: 1em;
 
   font-family: apple color emoji,segoe ui emoji,noto color emoji,android emoji,emojisymbols,emojione mozilla,twemoji mozilla,segoe ui symbol;
 }
@@ -1067,6 +1062,13 @@ img.emoji {
   width: 18px;
   height: 18px;
   margin: 0 .125rem;
+
+  display: inline-block;
+  /* width: 100%;
+  height: 100%; */
+  max-width: 100%;
+  max-height: 100%;
+  vertical-align: middle;
 }
 
 .btn-circle {
@@ -1157,7 +1159,7 @@ img.emoji {
   }
 }
 
-[contenteditable] {
+[contenteditable=true] {
   user-select: text;
 }