From e3a4ad778ae106e6b493c2ed81b9bc8b1be512ec Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@matrix.org>
Date: Mon, 22 Oct 2018 15:51:27 +0200
Subject: [PATCH 1/4] not needed anymore

also confuses resizer offset calculation,
which will need to be fixed regardlessly though
---
 res/css/structures/_LeftPanel.scss | 1 -
 1 file changed, 1 deletion(-)

diff --git a/res/css/structures/_LeftPanel.scss b/res/css/structures/_LeftPanel.scss
index ca4a5ea6f3..27b19164c4 100644
--- a/res/css/structures/_LeftPanel.scss
+++ b/res/css/structures/_LeftPanel.scss
@@ -48,7 +48,6 @@ limitations under the License.
 .mx_LeftPanel {
     background-color: $secondary-accent-color;
     flex: 1;
-    position: relative;
     overflow-x: hidden;
     display: flex;
     flex-direction: column;

From 15059fe0053b25e037fe264e56a6955e843242fa Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@matrix.org>
Date: Mon, 22 Oct 2018 15:55:29 +0200
Subject: [PATCH 2/4] make sure the room list doesn't grow taller than viewport

by setting the min-height to 0 at every flex level,
since by default it's auto which means grow as tall as you need
to make the content fit.
---
 res/css/structures/_LeftPanel.scss  | 1 +
 res/css/structures/_MatrixChat.scss | 1 +
 res/css/views/rooms/_RoomList.scss  | 1 +
 3 files changed, 3 insertions(+)

diff --git a/res/css/structures/_LeftPanel.scss b/res/css/structures/_LeftPanel.scss
index 27b19164c4..fc1622aa4d 100644
--- a/res/css/structures/_LeftPanel.scss
+++ b/res/css/structures/_LeftPanel.scss
@@ -51,6 +51,7 @@ limitations under the License.
     overflow-x: hidden;
     display: flex;
     flex-direction: column;
+    min-height: 0;
 }
 
 .mx_LeftPanel .mx_AppTile_mini {
diff --git a/res/css/structures/_MatrixChat.scss b/res/css/structures/_MatrixChat.scss
index 4f817eef44..a6027f246f 100644
--- a/res/css/structures/_MatrixChat.scss
+++ b/res/css/structures/_MatrixChat.scss
@@ -54,6 +54,7 @@ limitations under the License.
     order: 2;
 
     flex: 1;
+    min-height: 0;
 }
 
 .mx_MatrixChat_syncError {
diff --git a/res/css/views/rooms/_RoomList.scss b/res/css/views/rooms/_RoomList.scss
index 3cb5be1952..2c619b23bc 100644
--- a/res/css/views/rooms/_RoomList.scss
+++ b/res/css/views/rooms/_RoomList.scss
@@ -21,6 +21,7 @@ limitations under the License.
     /* use flexbox to layout sublists */
     display: flex;
     flex-direction: column;
+    min-height: 0;
 }
 
 /* hide resize handles next to collapsed / empty sublists */

From 4d53e13a28be36f68a2cf844edd4b18f92ae664a Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@matrix.org>
Date: Mon, 22 Oct 2018 15:56:39 +0200
Subject: [PATCH 3/4] make manual resizing follow cursor more accurately

by clearing flex-grow that was set based on the list size,
you don't want it to grow anymore but be exactly the size
you are giving it.
---
 src/resizer/sizer.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/resizer/sizer.js b/src/resizer/sizer.js
index 4ae35e020a..303214854b 100644
--- a/src/resizer/sizer.js
+++ b/src/resizer/sizer.js
@@ -99,6 +99,7 @@ class Sizer {
 
 class FlexSizer extends Sizer {
     setItemSize(item, size) {
+        item.style.flexGrow = `0`;
         item.style.flexBasis = `${Math.round(size)}px`;
     }
 }

From a69463e7faa2da468e988cb80e94cef5fa211e8a Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@matrix.org>
Date: Mon, 22 Oct 2018 15:57:56 +0200
Subject: [PATCH 4/4] clear height flexbox properties when collapsing

so item doesn't maintain height given by resizing
---
 src/components/structures/RoomSubList.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js
index e00f0f2d03..6f187b7699 100644
--- a/src/components/structures/RoomSubList.js
+++ b/src/components/structures/RoomSubList.js
@@ -344,7 +344,7 @@ const RoomSubList = React.createClass({
                 "mx_RoomSubList_nonEmpty": len && !this.state.hidden,
             });
             if (this.state.hidden) {
-                return <div className={subListClasses}>
+                return <div className={subListClasses} style={{flexBasis: "unset", flexGrow: "unset"}}>
                     {this._getHeaderJsx()}
                 </div>;
             } else {