From 5fe479e8a958fb73a0adc2a3ebbda79650f56501 Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@matrix.org>
Date: Wed, 14 Oct 2020 10:20:20 +0200
Subject: [PATCH] fix styling for room list items

---
 src/ui/web/css/left-panel.css           |  2 +-
 src/ui/web/css/themes/element/theme.css | 16 ++++++++++++----
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/ui/web/css/left-panel.css b/src/ui/web/css/left-panel.css
index 3b49ff51..f00c1572 100644
--- a/src/ui/web/css/left-panel.css
+++ b/src/ui/web/css/left-panel.css
@@ -40,7 +40,7 @@ limitations under the License.
     overscroll-behavior: contain;
 }
 
-.RoomList li {
+.RoomList > li > a {
     display: flex;
     align-items: center;
 }
diff --git a/src/ui/web/css/themes/element/theme.css b/src/ui/web/css/themes/element/theme.css
index cd3ed8c6..b4a1b546 100644
--- a/src/ui/web/css/themes/element/theme.css
+++ b/src/ui/web/css/themes/element/theme.css
@@ -235,15 +235,23 @@ button.utility.grid.on {
     margin-right: -8px;
 }
 
-.RoomList li {
+.RoomList > li {
     margin: 0;
-    padding-right: 8px;
+    padding: 4px 8px 4px 0;
+    /* vertical align */
+    align-items: center;
+}
+
+.RoomList > li > a {
+    text-decoration: none;
     /* vertical align */
     align-items: center;
 }
 
 .RoomList li:not(:first-child) {
-    margin-top: 12px;
+    /* space between items is 12px but we take 4px padding
+    on each side for the background of the active state*/
+    margin-top: 4px;
 }
 
 .RoomList li.active {
@@ -251,7 +259,7 @@ button.utility.grid.on {
     border-radius: 5px;
 }
 
-.RoomList li > * {
+.RoomList li > a > * {
     margin-right: 8px;
 }