FIX: mobile overflow for tall fixed modals

FIX: mobile overflow for tall fixed modals

diff --git a/app/assets/stylesheets/desktop/login.scss b/app/assets/stylesheets/desktop/login.scss
index 122d95e..2f28e06 100644
--- a/app/assets/stylesheets/desktop/login.scss
+++ b/app/assets/stylesheets/desktop/login.scss
@@ -169,7 +169,7 @@
       margin-bottom: 5px;
       max-height: 475px;
       @media screen and (max-height: 768px) {
-        max-height: 60vh;
+        max-height: calc(60vh - 100px);
       }
       overflow-x: hidden;
       overflow-y: auto;
diff --git a/app/assets/stylesheets/mobile/modal.scss b/app/assets/stylesheets/mobile/modal.scss
index 4d6439d..4cee126 100644
--- a/app/assets/stylesheets/mobile/modal.scss
+++ b/app/assets/stylesheets/mobile/modal.scss
@@ -5,7 +5,6 @@
 }
 
 .modal-middle-container {
-  margin-top: 10%;
   max-width: 100%;
   margin-bottom: 30px; // For iOS Safari issues
 }
@@ -99,3 +98,15 @@
 .modal-inner-container {
   margin-bottom: 20px;
 }
+
+/* fix for tall modals */
+
+.fixed-modal {
+  .modal-middle-container {
+    margin-bottom: 0;
+  }
+  .modal-inner-container {
+    max-height: 90vh;
+    overflow: auto;
+  }
+}

GitHub sha: 9e54e014

1 Like

This commit has been mentioned on Discourse Meta. There might be relevant details there: