Merge pull request #6461 from matrix-org/gsouquet/fix-18128

Author: germain-gg

res/css/views/rooms/_EventBubbleTile.scss

@@ -155,12 +155,20 @@ limitations under the License.
     .mx_EventTile_avatar {
         position: absolute;
         top: 0;
+        line-height: 1;
+        z-index: 9;
         img {
             box-shadow: 0 0 0 3px $eventbubble-avatar-outline;
             border-radius: 50%;
         }
     }
 
+    &.mx_EventTile_noSender {
+        .mx_EventTile_avatar {
+            top: -19px;
+        }
+    }
+
     .mx_BaseAvatar,
     .mx_EventTile_avatar {
         line-height: 1;

src/components/views/rooms/EventTile.tsx

@@ -896,6 +896,7 @@ export default class EventTile extends React.Component<IProps, IState> {
             mx_EventTile_unknown: !isBubbleMessage && this.state.verified === E2E_STATE.UNKNOWN,
             mx_EventTile_bad: isEncryptionFailure,
             mx_EventTile_emote: msgtype === 'm.emote',
+            mx_EventTile_noSender: this.props.hideSender,
         });
 
         // If the tile is in the Sending state, don't speak the message.