From 789c7b60cc238d4b264d444e8e911a60d82c7b50 Mon Sep 17 00:00:00 2001
From: lukebarnard <luke.barnard99@gmail.com>
Date: Thu, 19 Jan 2017 16:51:41 +0100
Subject: [PATCH] CSS for avatars that appear when users are typing

---
 .../structures/_RoomStatusBar.scss            | 27 +++++++++++++++++--
 1 file changed, 25 insertions(+), 2 deletions(-)

diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_RoomStatusBar.scss b/src/skins/vector/css/matrix-react-sdk/structures/_RoomStatusBar.scss
index 5daac88f..12cecffe 100644
--- a/src/skins/vector/css/matrix-react-sdk/structures/_RoomStatusBar.scss
+++ b/src/skins/vector/css/matrix-react-sdk/structures/_RoomStatusBar.scss
@@ -40,12 +40,12 @@ limitations under the License.
     opacity: 0.5;
     position: relative;
     top: -4px;
-/*    
+/*
     animation-duration: 1s;
     animation-name: bounce;
     animation-direction: alternate;
     animation-iteration-count: infinite;
-*/    
+*/
 }
 
 .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 {
     cursor: pointer;
 }