From 93ccccc03d3911c525d31f8e5bb8ad3d483b2b55 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Tue, 5 Sep 2023 10:11:26 +0100
Subject: [PATCH] Fix regression around FacePile with overflow (#11527)

* Work around compound-web AvatarStack not applying overlap to non-Avatars

* Fix FacePile overflow tile not being layed out correctly
---
 res/css/views/elements/_FacePile.pcss      | 1 +
 src/components/views/elements/FacePile.tsx | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/res/css/views/elements/_FacePile.pcss b/res/css/views/elements/_FacePile.pcss
index ecc801cb516..921965dd59b 100644
--- a/res/css/views/elements/_FacePile.pcss
+++ b/res/css/views/elements/_FacePile.pcss
@@ -20,6 +20,7 @@ limitations under the License.
     width: 30px;
     height: 30px;
     background-color: $spacePanel-bg-color;
+    display: inline-block;
 
     &::before {
         content: "";
diff --git a/src/components/views/elements/FacePile.tsx b/src/components/views/elements/FacePile.tsx
index ab71cff7cbe..2ade713816d 100644
--- a/src/components/views/elements/FacePile.tsx
+++ b/src/components/views/elements/FacePile.tsx
@@ -57,7 +57,8 @@ const FacePile: FC<IProps> = ({
 
     const pileContents = (
         <>
-            {overflow ? <span className="mx_FacePile_more" /> : null}
+            {/* XXX: The margin-left is a workaround for Compound's styling excluding this element and being overly specific */}
+            {overflow ? <span className="mx_FacePile_more" style={{ marginLeft: `calc(${size} * -0.2)` }} /> : null}
             {faces}
         </>
     );