Missing left padding for user mention pill when not showing avatar

[andybalaam]

Steps to reproduce

1. In Settings set "Show avatars in user and room mentions" to false
   
2. Go to a room where a user was mentioned

Outcome

What did you expect?

Padding on both sides of the user's name

What happened instead?

The left side of the user's name is too close to the edge of the pill

Operating system

Ubuntu 21.10

Browser information

Firefox 99.0

URL for webapp

https://develop.element.io

Application version

Element version: 31b4354-react-7e15bef06234-js-da69ca215b9c Olm version: 3.2.8

Homeserver

matrix.org

Will you send logs?

No

[andybalaam]

Implementation note: when I manually set .mx_Pill's padding to 0.1rem 0.4em 0.1rem 0.4rem instead of the current 0.1rem 0.4em 0.1rem 0 the problem is fixed (the fixed version ends with 0.4rem instead of 0.

But, this will presumably break the appearance when the avatar is visible.

[SimonBrandner]

Regressed by matrix-org/matrix-react-sdk#6398