mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-10-23 03:05:45 +03:00
Code Issues Projects Releases Packages Wiki Activity

Style mentions as pills in rich text editor (#10448)

Browse source
This commit is contained in:
alunturner 2023-04-03 10:16:29 +01:00 committed by GitHub
parent f933806b63
commit 6ac366ee5a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 30 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
res/css/views/rooms/wysiwyg_composer/components/_Editor.pcss
View file

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