Initial tag section header badge

src/components/structures/RoomSubList.js

@@ -339,6 +339,7 @@ var RoomSubList = React.createClass({
                 { this.props.collapsed ? '' : this.props.label }
                 <div className="mx_RoomSubList_roomCount">{this.props.list.length > 0 ? this.props.list.length : ''}</div>
                 <div className={chevronClasses}></div>
+                <div className="mx_RoomSubList_badge">0</div>
             </div>
         );
     },

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;