Merge pull request #11 from lshap/master

[FIX] Fix add location popup too short on mobile
lshap · May 17, 2016 · 1ae8f07 · 1ae8f07
2 parents 7fd97f8 + 7cc7585
commit 1ae8f07
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 11 deletions.
diff --git a/public/streetlives.css b/public/streetlives.css
@@ -267,11 +267,6 @@
 
 .Button.is-hidden {
   display: none; }
-@media screen and (max-width: 360px) {
-  .LocationForm-inner.js-content {
-    top: 120px;
-    width: 290px; } }
-
 .LocationForm {
   position: absolute;
   width: 100%;
@@ -350,6 +345,16 @@
   margin: 0 0 10px 0;
   padding: 0 0 5px 0;
   border-bottom: 1px solid #ccc; }
+
+@media screen and (max-width: 360px) {
+  .LocationForm-inner.js-content {
+    top: 120px;
+    width: 290px; } }
+
+@media screen and (max-width: 470px) {
+  .LocationForm-inner.js-content {
+    max-height: 100%;
+    overflow-y: scroll; } }
 .Map .SearchField {
   position: absolute;
   width: 500px;

diff --git a/sources/scss/location.scss b/sources/scss/location.scss
@@ -1,9 +1,3 @@
-@media screen and (max-width: 360px) {
-    .LocationForm-inner.js-content {
-        top: 120px;
-        width: 290px; 
-    }
-}
 .LocationForm {
   position: absolute;
   width: 100%;
@@ -88,3 +82,16 @@
   border-bottom: 1px solid #ccc;
 }
 
+@media screen and (max-width: 360px) {
+    .LocationForm-inner.js-content {
+        top: 120px;
+        width: 290px; 
+    }
+}
+
+@media screen and (max-width: 470px) {
+    .LocationForm-inner.js-content {
+        max-height: 100%;
+        overflow-y: scroll;
+    }
+}