fix emojis overflowing the chat message (#3228)

* fix emojis overflowing the chat message

* fix: force ignoring of certain paths?

---------

Co-authored-by: janWilejan <>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>

web/components/chat/ChatUserMessage/emojiMatcher.ts

@@ -11,7 +11,7 @@ interface options {
   className: string;
 }
 
-const emojiPattern = '\\p{RGI_Emoji}+';
+const emojiPattern = '\\p{RGI_Emoji}';
 
 const regexSupportsUnicodeSets = (() => {
   // Using a variable for regexpFlags to avoid eslint error about the flag

web/styles/globals.scss

@@ -124,11 +124,10 @@ body {
 }
 
 .emoji {
-  display: inline-block;
   font-size: 30px;
   height: 30px;
   line-height: 30px;
-  margin-left: 5px;
-  margin-right: 5px;
+  margin-left: 2px;
+  margin-right: 2px;
   vertical-align: middle;
 }