From b35dbeecb4c3d22cb6c9625fa6236ec35bc40422 Mon Sep 17 00:00:00 2001
From: Kireeti <97286047+Kireeti-28@users.noreply.github.com>
Date: Thu, 1 Jun 2023 03:12:31 +0530
Subject: [PATCH] Update multiple_reactions_engagement's alignment (#19484)

---
 app/assets/stylesheets/views/article.scss     | 20 +++++++++----------
 .../articles/_multiple_engagements.html.erb   |  2 --
 2 files changed, 10 insertions(+), 12 deletions(-)

diff --git a/app/assets/stylesheets/views/article.scss b/app/assets/stylesheets/views/article.scss
index 03236d868..99d744426 100644
--- a/app/assets/stylesheets/views/article.scss
+++ b/app/assets/stylesheets/views/article.scss
@@ -473,18 +473,18 @@
 
 .multiple_reactions_engagement {
   padding: 0.5em 0;
-  height: 43px;
   cursor: default;
+  display: flex;
+  column-gap: 2.2em;
+  flex-wrap: wrap;
 
-  span {
-    margin-right: 1em;
-    vertical-align: middle;
-  }
-  svg {
-    display: inline-block;
-  }
-  img {
-    vertical-align: middle;
+  &>span {
+    &.hidden {
+      display: none;
+    }
+    display: flex;
+    column-gap: 0.3em;
+    align-items: center;
   }
 }
 
diff --git a/app/views/articles/_multiple_engagements.html.erb b/app/views/articles/_multiple_engagements.html.erb
index 4d9fb9cf8..38f3e80c9 100644
--- a/app/views/articles/_multiple_engagements.html.erb
+++ b/app/views/articles/_multiple_engagements.html.erb
@@ -5,6 +5,4 @@
       <span id="reaction_engagement_<%= reaction_type.slug %>_count">&nbsp;</span>
     </span>
   <% end %>
-
-  <span class="placeholder" style="width: 24px; height: 24px;">&nbsp;</span>
 </div>