Fix other user's displayName being wrapped on the bubble message layout (#8456)

t3chguy/dedup-icons-17oct
Suguru Hirahara 2022-05-22 07:07:29 +00:00 committed by GitHub
parent 6825b43f42
commit 11cb48176e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 22 additions and 15 deletions

View File

@ -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;
}

View File

@ -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,

View File

@ -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;

View File

@ -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;
}
}