discourse/plugins/chat/assets/stylesheets/common/chat-unread-indicator.scss
chapoi fca6c1836c
UX: Chat unread indicator refactor (#22040)
* move the chat unread indicator to top to match the profile avatar indicator
* add white border to profile avatar indicator (badge notification) to match chat indicator and userstatus styling
* change `.urgent` to BEM
* congregate all styling into mixin
  * update chat index to use mixin
  * update thread indicator to use mixin
  * update header indicator to use mixin

---------

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Co-authored-by: Martin Brennan <martin@discourse.org>
2023-06-12 14:33:45 +10:00

24 lines
510 B
SCSS

@mixin chat-unread-indicator {
@include unselectable;
width: 14px;
height: 14px;
border-radius: 1em;
box-sizing: content-box;
-webkit-touch-callout: none;
background: var(--tertiary-med-or-tertiary);
color: var(--secondary);
font-size: var(--font-down-2);
text-align: center;
transition: border-color linear 0.15s;
&.-urgent {
background: var(--success);
color: var(--secondary);
}
&__number {
color: var(--secondary);
line-height: var(--line-height-small);
}
}