Make the pill text single line (#8744)

res/css/views/rooms/_BasicMessageComposer.scss

@@ -57,6 +57,10 @@ limitations under the License.
                 user-select: all;
                 position: relative;
                 cursor: unset; // We don't want indicate clickability
+                display: inline-block;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
 
                 &:hover {
                     // We don't want indicate clickability | To override the overriding of .markdown-body
@@ -65,8 +69,10 @@ limitations under the License.
 
                 // avatar psuedo element
                 &::before {
+                    display: inline-block;
                     content: var(--avatar-letter);
                     width: $font-16px;
+                    min-width: $font-16px; // ensure the avatar is not compressed
                     height: $font-16px;
                     margin-inline-end: 0.24rem;
                     background: var(--avatar-background), $background;