CSS for room notification pills

This commit is contained in:
David Baker 2017-11-01 19:45:59 +00:00
parent 56c6a15ddf
commit cd84d86fd1
1 changed files with 8 additions and 5 deletions

View File

@ -3,7 +3,8 @@
// --Matthew // --Matthew
.mx_UserPill, .mx_UserPill,
.mx_RoomPill { .mx_RoomPill,
.mx_AtRoomPill {
border-radius: 16px; border-radius: 16px;
display: inline-block; display: inline-block;
height: 20px; height: 20px;
@ -24,9 +25,10 @@
padding-right: 5px; padding-right: 5px;
} }
.mx_EventTile_highlight .mx_EventTile_content .markdown-body a.mx_UserPill_me { .mx_EventTile_highlight .mx_EventTile_content .markdown-body a.mx_UserPill_me, .mx_AtRoomPill {
color: $accent-fg-color; /* !important because otherwise @room pills in links get their colours clobbered by links styles :( */
background-color: $mention-user-pill-bg-color; color: $accent-fg-color !important;
background-color: $mention-user-pill-bg-color !important;
padding-right: 5px; padding-right: 5px;
} }
@ -39,7 +41,8 @@
} }
.mx_UserPill .mx_BaseAvatar, .mx_UserPill .mx_BaseAvatar,
.mx_RoomPill .mx_BaseAvatar { .mx_RoomPill .mx_BaseAvatar,
.mx_AtRoomPill .mx_BaseAvatar {
position: relative; position: relative;
left: -3px; left: -3px;
top: 2px; top: 2px;