From d8f913b3a0d787a06bc39eaad514d52b6607b350 Mon Sep 17 00:00:00 2001
From: zubiden <19638254+zubiden@users.noreply.github.com>
Date: Mon, 27 Apr 2026 14:29:23 +0200
Subject: [PATCH] Custom Emoji: Limit canvas size to wrapper (#6890)

---
 src/components/common/CustomEmoji.module.scss       | 2 ++
 src/components/common/RankBadge.tsx                 | 4 +++-
 src/components/middle/message/_message-content.scss | 5 +++++
 3 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/common/CustomEmoji.module.scss b/src/components/common/CustomEmoji.module.scss
index a0f3fdaf2..0a3c4fb56 100644
--- a/src/components/common/CustomEmoji.module.scss
+++ b/src/components/common/CustomEmoji.module.scss
@@ -13,6 +13,8 @@
 
   :global(.rlottie-canvas) {
     display: block;
+    width: 100% !important;
+    height: 100% !important;
   }
 }
 
diff --git a/src/components/common/RankBadge.tsx b/src/components/common/RankBadge.tsx
index 2d54e7e5a..9e52404ed 100644
--- a/src/components/common/RankBadge.tsx
+++ b/src/components/common/RankBadge.tsx
@@ -28,6 +28,7 @@ const RankBadge = ({
   const { openRankModal } = getActions();
   const lang = useLang();
   const hasCustomColor = isOwner || isAdmin;
+  const isPlain = !hasCustomColor;
 
   const rankText = rank || (isOwner && lang('ChannelCreator')) || (isAdmin && lang('ChannelAdmin'));
 
@@ -44,9 +45,10 @@ const RankBadge = ({
     <BadgeButton
       className={buildClassName(
         hasCustomColor && getPeerColorClass(isOwner ? OWNER_PEER_COLOR : ADMIN_PEER_COLOR),
+        isPlain && 'admin-title-plain',
         className,
       )}
-      isPlain={!hasCustomColor}
+      isPlain={isPlain}
       inline
       onClick={isClickable ? handleClick : undefined}
     >
diff --git a/src/components/middle/message/_message-content.scss b/src/components/middle/message/_message-content.scss
index b565a615b..2c60bd7da 100644
--- a/src/components/middle/message/_message-content.scss
+++ b/src/components/middle/message/_message-content.scss
@@ -335,6 +335,7 @@
 
     .sender-title {
       overflow: hidden;
+      line-height: normal;
       text-overflow: ellipsis;
     }
 
@@ -416,6 +417,10 @@
       margin-right: -0.1875rem;
     }
 
+    .admin-title-plain {
+      padding-inline: 0.25rem;
+    }
+
     .admin-title {
       font-size: 0.75rem;
       font-weight: var(--font-weight-normal);