CSS for avatars that appear when users are typing

This commit is contained in:
lukebarnard 2017-01-19 16:51:41 +01:00
parent 61c5253dbf
commit 789c7b60cc

View file

@ -40,12 +40,12 @@ limitations under the License.
opacity: 0.5; opacity: 0.5;
position: relative; position: relative;
top: -4px; top: -4px;
/* /*
animation-duration: 1s; animation-duration: 1s;
animation-name: bounce; animation-name: bounce;
animation-direction: alternate; animation-direction: alternate;
animation-iteration-count: infinite; animation-iteration-count: infinite;
*/ */
} }
.mx_RoomStatusBar_placeholderIndicator span:nth-child(1) { .mx_RoomStatusBar_placeholderIndicator span:nth-child(1) {
@ -70,6 +70,29 @@ limitations under the License.
} }
} }
.mx_RoomStatusBar_typingIndicatorAvatars {
width: 24px;
text-align: left;
}
.mx_RoomStatusBar_typingIndicatorAvatars .mx_BaseAvatar {
margin-right: -12px;
}
.mx_RoomStatusBar_typingIndicatorRemaining {
display: inline-block;
color: #acacac;
background-color: #ddd;
border-radius: 40px;
width: 24px;
height: 24px;
line-height: 24px;
font-size: 0.8em;
vertical-align: top;
text-align: center;
position: absolute;
}
.mx_RoomStatusBar_scrollDownIndicator { .mx_RoomStatusBar_scrollDownIndicator {
cursor: pointer; cursor: pointer;
} }