From 010f077092f8fd59a05198a5d8b2e268c3230585 Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@matrix.org>
Date: Mon, 5 Nov 2018 10:35:38 +0100
Subject: [PATCH] align badges with design

---
 res/css/structures/_RoomSubList.scss | 21 ++++---------------
 res/css/views/rooms/_RoomTile.scss   | 30 ++--------------------------
 2 files changed, 6 insertions(+), 45 deletions(-)

diff --git a/res/css/structures/_RoomSubList.scss b/res/css/structures/_RoomSubList.scss
index 2b89e055df..9eebbfe63f 100644
--- a/res/css/structures/_RoomSubList.scss
+++ b/res/css/structures/_RoomSubList.scss
@@ -28,6 +28,7 @@ limitations under the License.
 .mx_RoomSubList_labelContainer {
     display: flex;
     flex-direction: row;
+    align-items: center;
     flex: 0 0 auto;
     margin: 8px 19px 0 0;
 }
@@ -56,14 +57,12 @@ limitations under the License.
 }
 
 .mx_RoomSubList_badge {
-    height: 18px;
-    border-radius: 9px;
+    flex: 0 1 content;
+    border-radius: 8px;
     color: $accent-fg-color;
     font-weight: 600;
     font-size: 12px;
-    vertical-align: middle;
-    line-height: 18px;
-    padding: 0 4px;
+    padding: 0 5px;
     background-color: $accent-color;
 }
 
@@ -92,18 +91,6 @@ limitations under the License.
     background-color: $warning-color;
 }
 
-/* This is the bottom of the speech bubble */
-.mx_RoomSubList_badgeHighlight:after {
-    content: "";
-    position: absolute;
-    display: block;
-    width: 0;
-    height: 0;
-    margin-left: 5px;
-    border-top: 5px solid $warning-color;
-    border-right: 7px solid transparent;
-}
-
 .mx_RoomSubList_chevron {
     left: 0px;
     pointer-events: none;
diff --git a/res/css/views/rooms/_RoomTile.scss b/res/css/views/rooms/_RoomTile.scss
index ca23d79137..4bedc4cf4f 100644
--- a/res/css/views/rooms/_RoomTile.scss
+++ b/res/css/views/rooms/_RoomTile.scss
@@ -21,7 +21,7 @@ limitations under the License.
     cursor: pointer;
     height: 40px;
     margin: 0;
-    padding: 2px 12px;
+    padding: 2px 10px;
     position: relative;
     background-color: $secondary-accent-color;
 }
@@ -88,43 +88,17 @@ limitations under the License.
         padding: 0px 4px 0px 4px;
         z-index: 3;
     }
-
-    /* Hide the bottom of speech bubble */
-    .mx_RoomTile_highlight .mx_RoomTile_badge:after {
-        display: none;
-    }
-}
-
-/* This is the bottom of the speech bubble */
-.mx_RoomTile_highlight .mx_RoomTile_badge:after {
-    content: "";
-    position: absolute;
-    display: block;
-    width: 0;
-    height: 0;
-    margin-left: 5px;
-    border-top: 5px solid $warning-color;
-    border-right: 7px solid transparent;
 }
 
 .mx_RoomTile_badge {
     flex: 0 1 content;
-    min-width: 15px;
     border-radius: 8px;
     color: $accent-fg-color;
     font-weight: 600;
     font-size: 12px;
-    text-align: center;
-    padding-top: 1px;
-    padding-left: 4px;
-    padding-right: 4px;
+    padding: 0 5px;
 }
 
-.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton,
-.mx_RoomTile.mx_RoomTile_menuDisplayed .mx_RoomTile_badge {
-    letter-spacing: 0.1em;
-    opacity: 1;
-}
 
 .mx_RoomTile.mx_RoomTile_noBadges .mx_RoomTile_badge.mx_RoomTile_badgeButton,
 .mx_RoomTile.mx_RoomTile_menuDisplayed.mx_RoomTile_noBadges .mx_RoomTile_badge {