From 66e93c8a8cad6bde32e42d7b3b3a3eb3ce13ff14 Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Wed, 1 Mar 2017 10:04:48 +0000 Subject: [PATCH 1/2] Fix for vector-im/riot-web#3298 - height:100% for welcome pages on Safari --- .../vector/css/matrix-react-sdk/structures/_MatrixChat.scss | 5 +++++ src/skins/vector/css/vector-web/structures/_HomePage.scss | 2 ++ 2 files changed, 7 insertions(+) diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss index 05a39ea7..473f292f 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss @@ -100,6 +100,11 @@ limitations under the License. * flex itself. */ display: flex; + + /* To fix https://github.com/vector-im/riot-web/issues/3298 where Safari + needed height 100% all the way down to the HomePage. + */ + height: 100%; } .mx_MatrixChat .mx_RightPanel { diff --git a/src/skins/vector/css/vector-web/structures/_HomePage.scss b/src/skins/vector/css/vector-web/structures/_HomePage.scss index 11040c4b..e2af399d 100644 --- a/src/skins/vector/css/vector-web/structures/_HomePage.scss +++ b/src/skins/vector/css/vector-web/structures/_HomePage.scss @@ -18,6 +18,8 @@ limitations under the License. .mx_HomePage { max-width: 960px; width: 100%; + height: 100%; + overflow-y: hidden; margin-left: auto; margin-right: auto; } From 9d96baa613bff80c34d0400be0f607cccfe31232 Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Tue, 7 Mar 2017 10:22:45 +0000 Subject: [PATCH 2/2] Alter comments on height: auto Having tested Riot with the middlePanel having a height of 100%, it seems to be OK. --- .../css/matrix-react-sdk/structures/_MatrixChat.scss | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss index 473f292f..10528b36 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss @@ -90,19 +90,11 @@ limitations under the License. */ overflow-x: auto; - /* XXX: Hack: apparently if you try to nest a flex-box - * within a non-flex-box within a flex-box, the height - * of the innermost element gets miscalculated if the - * parents are both auto. Height has to be auto here - * for RoomView to correctly fit when the Toolbar is shown. - * Ideally we'd launch straight into the RoomView at this - * point, but instead we fudge it and make the middlePanel - * flex itself. - */ display: flex; /* To fix https://github.com/vector-im/riot-web/issues/3298 where Safari - needed height 100% all the way down to the HomePage. + needed height 100% all the way down to the HomePage. Height does not + have to be auto, empirically. */ height: 100%; }