From b26a420c7a0066d60fc68014a5adc0b62ba2a72b Mon Sep 17 00:00:00 2001
From: Anders Kaseorg <anders@zulipchat.com>
Date: Thu, 23 Apr 2020 14:49:51 -0700
Subject: [PATCH] =?UTF-8?q?styles:=20Size=20full-viewport=20fixed=20elemen?=
 =?UTF-8?q?ts=20as=20100%,=20not=20100vw=20=C3=97=20100vh.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Mobile Chrome includes the height of the address bar in its
calculation of 100vh, which was causing a corresponding part of our
content to be pushed off the bottom of the screen.

Fixes #11324.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
---
 static/styles/app_components.scss | 4 ++--
 static/styles/popovers.scss       | 4 ++--
 static/styles/subscriptions.scss  | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/static/styles/app_components.scss b/static/styles/app_components.scss
index 4b6e09d0b0..80293fb30c 100644
--- a/static/styles/app_components.scss
+++ b/static/styles/app_components.scss
@@ -268,8 +268,8 @@
     position: fixed;
     top: 0;
     left: 0;
-    width: 100vw;
-    height: 100vh;
+    width: 100%;
+    height: 100%;
     overflow: auto;
     -webkit-overflow-scrolling: touch;
 
diff --git a/static/styles/popovers.scss b/static/styles/popovers.scss
index a68a63879d..9539b292e4 100644
--- a/static/styles/popovers.scss
+++ b/static/styles/popovers.scss
@@ -296,8 +296,8 @@ ul {
         top: 0px !important;
         left: 0px !important;
         margin: 0 !important;
-        width: 100vw;
-        height: 100vh;
+        width: 100%;
+        height: 100%;
 
         background-color: hsla(0, 0%, 0%, 0.7);
         border-radius: 0px;
diff --git a/static/styles/subscriptions.scss b/static/styles/subscriptions.scss
index 7a59bb8035..e8cecc7a9a 100644
--- a/static/styles/subscriptions.scss
+++ b/static/styles/subscriptions.scss
@@ -362,8 +362,8 @@ form#add_new_subscription {
     position: fixed;
     top: 0;
     left: 0;
-    width: 100vw;
-    height: 100vh;
+    width: 100%;
+    height: 100%;
     background-color: hsla(0, 0%, 8%, 0.7);
     color: hsl(0, 0%, 27%);
 }