Carbon/src/sass/components/rooms.sass

66 lines
1.1 KiB
Sass

@use "../colors" as c
$list-width: 240px
$icon-size: 32px
$icon-padding: 8px
.c-rooms
background-color: c.$darker
padding: $icon-padding
width: $list-width
font-size: 18px
font-weight: 500
overflow-y: auto
scrollbar-width: thin
scrollbar-color: c.$darkest c.$darker
flex-shrink: 0
.c-room
display: flex
align-items: center
padding: $icon-padding * 0.75 $icon-padding
margin: $icon-padding * 0.25 0
cursor: pointer
border-radius: 8px
&:not(&--active):hover
background-color: c.$mild
&--active
background-color: c.$milder
&__icon
width: $icon-size
height: $icon-size
margin-right: $icon-padding
border-radius: 50%
flex-shrink: 0
&--no-icon
background-color: #bbb
&__name
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
flex: 1
&__number
flex-shrink: 0
line-height: 1
padding: 4px 5px
border-radius: 5px
font-size: 14px
pointer-events: none
&--none
display: none
&--unreads
background-color: #ddd
color: #111
&--notifications
background-color: #ffac4b
color: #000