Obliterate some flexboxes in the room list

We don't need columns of divs to equally size themselves, so use easier layout techniques to make the list fit in the container. We have to take a hit with `height:100%`, but the hit is much more insignificant than confusing the layout engine.

The layout engine has a hard time with dynamically-but-statically-sized stuff like `width: 100%; display: flex;`, particularly when it is nested so badly. Overall this should improve performance for the app by not having to re-paint so often.

Fixes https://github.com/vector-im/riot-web/issues/14639

res/css/structures/_LeftPanel.scss

@@ -135,12 +135,7 @@ $tagPanelWidth: 56px; // only applies in this file, used for calculations
         }
 
         .mx_LeftPanel_roomListWrapper {
-            // Create a flexbox to ensure the containing items cause appropriate overflow.
-            display: flex;
-
-            flex-grow: 1;
             overflow: hidden;
-            min-height: 0;
             margin-top: 10px; // so we're not up against the search/filter
 
             &.mx_LeftPanel_roomListWrapper_stickyBottom {
@@ -153,14 +148,8 @@ $tagPanelWidth: 56px; // only applies in this file, used for calculations
         }
 
         .mx_LeftPanel_actualRoomListContainer {
-            flex-grow: 1; // fill the available space
-            overflow-y: auto;
-            width: 100%;
-            max-width: 100%;
             position: relative; // for sticky headers
-
-            // Create a flexbox to trick the layout engine
-            display: flex;
+            height: 100%; // ensure scrolling still works
         }
     }
 

res/css/views/rooms/_RoomList.scss

@@ -15,11 +15,5 @@ limitations under the License.
 */
 
 .mx_RoomList {
-    width: calc(100% - 16px); // 16px of artificial right-side margin (8px is overflowed from the sublists)
-
-    // Create a column-based flexbox for the sublists. That's pretty much all we have to
-    // worry about in this stylesheet.
-    display: flex;
-    flex-direction: column;
-    flex-wrap: nowrap; // let the column overflow
+    padding-right: 7px; // width of the scrollbar, to line things up
 }

res/css/views/rooms/_RoomSublist.scss

@@ -15,15 +15,8 @@ limitations under the License.
 */
 
 .mx_RoomSublist {
-    // The sublist is a column of rows, essentially
-    display: flex;
-    flex-direction: column;
-
     margin-left: 8px;
     margin-bottom: 4px;
-    width: 100%;
-
-    flex-shrink: 0; // to convince safari's layout engine the flexbox is fine
 
     .mx_RoomSublist_headerContainer {
         // Create a flexbox to make alignment easy