From a77e9bfd8a51e9e7e81db890ee9df9b3e426fb4f Mon Sep 17 00:00:00 2001
From: zubiden <19638254+zubiden@users.noreply.github.com>
Date: Wed, 12 Jun 2024 18:10:42 +0200
Subject: [PATCH] Context Menu: Adjust styles (#4625)

---
 src/components/middle/message/reactions/ReactionSelector.scss | 4 ----
 src/components/middle/message/reactions/ReactionSelector.tsx  | 2 +-
 src/components/ui/MenuItem.scss                               | 4 ++--
 3 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/src/components/middle/message/reactions/ReactionSelector.scss b/src/components/middle/message/reactions/ReactionSelector.scss
index 58f8ba1f9..d49ee1cf7 100644
--- a/src/components/middle/message/reactions/ReactionSelector.scss
+++ b/src/components/middle/message/reactions/ReactionSelector.scss
@@ -5,10 +5,6 @@
   right: 0;
   top: -0.5rem;
 
-  &--isRtl {
-    left: 0;
-  }
-
   @media (max-width: 600px) {
     left: 0;
     right: 0;
diff --git a/src/components/middle/message/reactions/ReactionSelector.tsx b/src/components/middle/message/reactions/ReactionSelector.tsx
index da4a55029..72b0a4ed2 100644
--- a/src/components/middle/message/reactions/ReactionSelector.tsx
+++ b/src/components/middle/message/reactions/ReactionSelector.tsx
@@ -157,7 +157,7 @@ const ReactionSelector: FC<OwnProps> = ({
   if (!reactionsToRender.length) return undefined;
 
   return (
-    <div className={buildClassName(cn('&', lang.isRtl && 'isRtl'), className)} ref={ref}>
+    <div className={buildClassName(cn('&'), className)} ref={ref}>
       <div className={cn('bubble-small', lang.isRtl && 'isRtl')} />
       <div className={cn('items-wrapper')}>
         <div className={cn('bubble-big', lang.isRtl && 'isRtl')} />
diff --git a/src/components/ui/MenuItem.scss b/src/components/ui/MenuItem.scss
index 32a685267..d00f8f792 100644
--- a/src/components/ui/MenuItem.scss
+++ b/src/components/ui/MenuItem.scss
@@ -129,6 +129,7 @@
     font-size: 0.875rem;
     margin: 0.125rem 0.25rem;
     padding: 0.25rem;
+    padding-inline-end: 0.75rem; // Icon padding + padding for symmetry
     border-radius: 0.375rem;
     width: auto;
     font-weight: 500;
@@ -138,8 +139,7 @@
     .icon {
       max-width: 1.25rem;
       font-size: 1.25rem;
-      margin-left: 0.5rem;
-      margin-right: 1.25rem;
+      margin-inline: 0.5rem 1.25rem;
 
       &::before {
         max-width: 1.25rem;