diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js
index a96e8d28..e4ca6edb 100644
--- a/src/components/structures/RoomSubList.js
+++ b/src/components/structures/RoomSubList.js
@@ -339,6 +339,7 @@ var RoomSubList = React.createClass({
{ this.props.collapsed ? '' : this.props.label }
{this.props.list.length > 0 ? this.props.list.length : ''}
+ 0
);
},
diff --git a/src/skins/vector/css/vector-web/structures/RoomSubList.css b/src/skins/vector/css/vector-web/structures/RoomSubList.css
index b1e89cb8..974cf3e7 100644
--- a/src/skins/vector/css/vector-web/structures/RoomSubList.css
+++ b/src/skins/vector/css/vector-web/structures/RoomSubList.css
@@ -46,6 +46,32 @@ limitations under the License.
padding-left: 5px;
}
+.collapsed .mx_RoomSubList_roomCount {
+ display: none;
+}
+
+.mx_RoomSubList_badge {
+ display: inline-block;
+ min-width: 15px;
+ height: 15px;
+ position: absolute;
+ right: 8px; /*gutter */
+ top: 7px;
+ border-radius: 8px;
+ color: #fff;
+ font-weight: 600;
+ font-size: 10px;
+ text-align: center;
+ padding-top: 1px;
+ padding-left: 4px;
+ padding-right: 4px;
+ background-color: #76cfa6; /* Temporary */
+}
+
+.collapsed .mx_RoomSubList_badge {
+ display: none;
+}
+
.mx_RoomSubList_chevron {
pointer-events: none;
position: absolute;