diff --git a/res/css/views/rooms/wysiwyg_composer/components/_Editor.pcss b/res/css/views/rooms/wysiwyg_composer/components/_Editor.pcss index 849fd3c5d3d..b15d3b74c17 100644 --- a/res/css/views/rooms/wysiwyg_composer/components/_Editor.pcss +++ b/res/css/views/rooms/wysiwyg_composer/components/_Editor.pcss @@ -101,9 +101,37 @@ limitations under the License. } } - /* this selector represents what will become a pill */ + /* this selector represents what will become a pill + nb despite there being mx_UserPill and mx_RoomPill classes appended to these pills + in the current composer, there don't appear to be any styles associated with those classes + in this repo */ a[data-mention-type] { - cursor: text; + /* these entries duplicate mx_Pill from _Pill.pcss */ + padding: $font-1px 0.4em; + line-height: $font-17px; + border-radius: $font-16px; + vertical-align: text-top; + /* TODO turning this on hides the cursor from the composer for some + reason, so comment out for now and assess if it's needed when we add + the Avatars + display: inline-flex; + align-items: center; not required with the above turned off + + Potential fix is using display: inline, width: fit-content + */ + box-sizing: border-box; + max-width: 100%; + overflow: hidden; + + color: $accent-fg-color; + background-color: $pill-bg-color; + + /* combining the overrides from _BasicMessageComposer.pcss */ + user-select: all; + position: relative; + cursor: unset; /* We don't want indicate clickability */ + text-overflow: ellipsis; + white-space: nowrap; } }