diff --git a/res/css/views/messages/_DisambiguatedProfile.scss b/res/css/views/messages/_DisambiguatedProfile.scss index caef2fa4ad3..cb605726dd9 100644 --- a/res/css/views/messages/_DisambiguatedProfile.scss +++ b/res/css/views/messages/_DisambiguatedProfile.scss @@ -18,15 +18,18 @@ limitations under the License. .mx_DisambiguatedProfile { overflow: hidden; text-overflow: ellipsis; + white-space: nowrap; + cursor: pointer; .mx_DisambiguatedProfile_displayName { font-weight: 600; + margin-inline-end: 0; } .mx_DisambiguatedProfile_mxid { font-weight: 600; font-size: 1.1rem; - margin-left: 5px; + margin-inline-start: 5px; opacity: 0.5; // Match mx_TextualEvent color: $primary-content; } diff --git a/res/css/views/rooms/_EventBubbleTile.scss b/res/css/views/rooms/_EventBubbleTile.scss index f21fa5cd9f0..b28021c49eb 100644 --- a/res/css/views/rooms/_EventBubbleTile.scss +++ b/res/css/views/rooms/_EventBubbleTile.scss @@ -117,6 +117,24 @@ limitations under the License. line-height: $font-18px; } + // other users profile on bubble layout + > .mx_DisambiguatedProfile { + white-space: normal; // display mxid + + .mx_DisambiguatedProfile_displayName { + white-space: nowrap; // truncate long display names + margin-inline-end: 5px; + + // For RTL displayName + unicode-bidi: embed; + direction: ltr; + } + + .mx_DisambiguatedProfile_mxid { + margin-inline-start: 0; // Align mxid with truncated displayName inside mx_EventTile[data-layout=bubble] + } + } + // inside mx_RoomView_MessageList, outside of mx_ReplyTile // (on the main panel and the chat panel with a maximized widget) > .mx_DisambiguatedProfile, diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 60f66339b23..053c7fab77f 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -138,14 +138,9 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss color: $primary-content; font-size: $font-14px; display: inline-block; - /* anti-zalgo, with overflow hidden */ - overflow: hidden; padding-bottom: 0px; padding-top: 0px; margin: 0px; - /* the next three lines, along with overflow hidden, truncate long display names */ - white-space: nowrap; - text-overflow: ellipsis; max-width: calc(100% - $left-gutter); } @@ -442,10 +437,6 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss // on ELS we need the margin to allow interaction with the expand/collapse button which is normally in the RR gutter } -.mx_DisambiguatedProfile { - cursor: pointer; -} - .mx_EventTile_bubbleContainer { display: grid; grid-template-columns: 1fr 100px; diff --git a/res/css/views/rooms/_ReplyTile.scss b/res/css/views/rooms/_ReplyTile.scss index ca8f886737e..fe8e5bce489 100644 --- a/res/css/views/rooms/_ReplyTile.scss +++ b/res/css/views/rooms/_ReplyTile.scss @@ -111,10 +111,5 @@ limitations under the License. display: inline-block; // anti-zalgo, with overflow hidden padding: 0; margin: 0; - - // truncate long display names - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; } }