From: Dan Karran <dan@karran.net>
Date: Sat, 26 Nov 2011 17:24:19 +0000 (+0000)
Subject: Mobile layout improvements
X-Git-Tag: live~6006
X-Git-Url: https://git.openstreetmap.org/rails.git/commitdiff_plain/080d347d8fb55534bcd0ac8dafd61479d0401dc8

Mobile layout improvements

Make the map fill the available space on smaller screens, and
style the search results sidebar a bit better when ?query= is
added to the URL to trigger the search.
---

diff --git a/app/assets/stylesheets/small.css.scss b/app/assets/stylesheets/small.css.scss
index 4b561349d..4dee3f1bf 100644
--- a/app/assets/stylesheets/small.css.scss
+++ b/app/assets/stylesheets/small.css.scss
@@ -87,6 +87,10 @@ h1 {
 
 /* Rules for OpenLayers maps */
 
+#map {
+  border: 0;
+}
+
 .olControlPanZoomBar {
   display: none;
 }
@@ -101,6 +105,29 @@ h1 {
   margin-right: 0px;
 }
 
+#content.site_index {
+  left: 0px;
+  right: 0px;
+  top: 38px;
+  bottom: 0px;
+  padding-bottom: 0px;
+}
+
+/* Rules for search sidebar when shown */
+
+#sidebar {
+  border: 0px;
+  border-right: 1px solid #ccccdd;
+}
+
+.sidebar_title, #sidebar_content {
+  font-size: 10px !important;
+}
+
+p.search_results_entry {
+  padding: 2px 0px;
+}
+
 /* Rules for the signup form */
 
 #signupForm input[type="text"], #signupForm input[type="password"] {
diff --git a/app/views/site/_resize.html.erb b/app/views/site/_resize.html.erb
index aa64e1d2b..9ee05a7c8 100644
--- a/app/views/site/_resize.html.erb
+++ b/app/views/site/_resize.html.erb
@@ -18,7 +18,7 @@
   function resizeMap() {
     var sidebar_width = 0 + $("#sidebar:visible").width();
 
-    if (sidebar_width > 0) {
+    if (sidebar_width > 0 && window.width > 641) {
       sidebar_width = sidebar_width + 5
     }
 
@@ -28,7 +28,9 @@
     $("#map").css("right", (sidebar_width) + "px");
     <% end -%>
     $("#map").width($("#content").width() - sidebar_width);
-    $("#map").height($("#content").height() - 2);
+    if (window.width > 641) {
+      $("#map").height($("#content").height() - 2);
+    }
   }
 
   function handleResize() {