Make not modify normal emoji's behavior

app/javascript/mastodon/features/emoji/emoji.js

@@ -28,7 +28,7 @@ const emojify = (str, customEmojis = {}) => {
         // if you want additional emoji handler, add statements below which set replacement and return true.
         if (shortname in customEmojis) {
           const filename = allowAnimations ? customEmojis[shortname].url : customEmojis[shortname].static_url;
-          replacement = `<img draggable="false" class="emojione" alt="${shortname}" title="${shortname}" src="${filename}" />`;
+          replacement = `<img draggable="false" class="emojione custom-emoji" alt="${shortname}" title="${shortname}" src="${filename}" />`;
           return true;
         }
         return false;

app/javascript/styles/mastodon/components.scss

@@ -521,6 +521,11 @@
   }
 
   .emojione {
+    width: 18px;
+    height: 18px;
+  }
+
+  .custom-emoji {
     width: 20px;
     height: 20px;
     margin: -5px 0 0;
@@ -784,6 +789,11 @@
     line-height: 24px;
 
     .emojione {
+      width: 22px;
+      height: 22px;
+    }
+
+    .custom-emoji {
       width: 24px;
       height: 24px;
       margin: -5px 0 0;

app/lib/formatter.rb

@@ -107,7 +107,7 @@ class Formatter
         emoji     = emoji_map[shortcode]
 
         if emoji
-          replacement = "<img draggable=\"false\" class=\"emojione\" alt=\":#{shortcode}:\" title=\":#{shortcode}:\" src=\"#{emoji}\" />"
+          replacement = "<img draggable=\"false\" class=\"emojione custom-emoji\" alt=\":#{shortcode}:\" title=\":#{shortcode}:\" src=\"#{emoji}\" />"
           before_html = shortname_start_index.positive? ? html[0..shortname_start_index - 1] : ''
           html        = before_html + replacement + html[i + 1..-1]
           i          += replacement.size - (shortcode.size + 2) - 1