From 8502f69849ea4c5149ff75699ecc70b5127b4e47 Mon Sep 17 00:00:00 2001
From: automated-signal <37887102+automated-signal@users.noreply.github.com>
Date: Thu, 16 May 2024 12:05:02 -0500
Subject: [PATCH] Fix contact icon in call participants list

Co-authored-by: Jamie Kyle <113370520+jamiebuilds-signal@users.noreply.github.com>
---
 stylesheets/_modules.scss                 |  1 +
 ts/components/CallingParticipantsList.tsx | 11 ++++-------
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss
index 6d7ca88ee0..2dc5a06e7a 100644
--- a/stylesheets/_modules.scss
+++ b/stylesheets/_modules.scss
@@ -4404,6 +4404,7 @@ button.module-image__border-overlay:focus {
   }
 
   &__contact-icon {
+    margin-inline-start: 0.3em;
     background-color: $color-gray-25;
   }
 
diff --git a/ts/components/CallingParticipantsList.tsx b/ts/components/CallingParticipantsList.tsx
index 085328b5a7..f2b570488a 100644
--- a/ts/components/CallingParticipantsList.tsx
+++ b/ts/components/CallingParticipantsList.tsx
@@ -134,13 +134,10 @@ export const CallingParticipantsList = React.memo(
                             title={participant.title}
                           />
                           {isInSystemContacts(participant) ? (
-                            <span>
-                              {' '}
-                              <InContactsIcon
-                                className="module-calling-participants-list__contact-icon"
-                                i18n={i18n}
-                              />
-                            </span>
+                            <InContactsIcon
+                              className="module-calling-participants-list__contact-icon"
+                              i18n={i18n}
+                            />
                           ) : null}
                         </>
                       )}