From 1f2d0e905db8563420c5e9d56beb270b4231022e Mon Sep 17 00:00:00 2001
From: Craig Cook <craigcook@gmail.com>
Date: Tue, 10 Jul 2012 11:26:58 -0700
Subject: [PATCH] Mobile layout fixes, menu fixes

* width:auto for mobile
* narrowed contribute newsletter form fields
* removed inline script from base template (should have been removed weeks ago, sorry I missed that)
* hooked base template to our new mobile menu script
---
 apps/mozorg/templates/mozorg/base-resp.html |  4 ++
 media/css/contribute.less                   |  8 ++++
 media/css/sandstone/sandstone-resp.less     |  3 +-
 settings/base.py                            |  5 +++
 templates/base-resp.html                    | 44 ---------------------
 5 files changed, 19 insertions(+), 45 deletions(-)

diff --git a/apps/mozorg/templates/mozorg/base-resp.html b/apps/mozorg/templates/mozorg/base-resp.html
index 55f559c18f..b2c2498dd5 100644
--- a/apps/mozorg/templates/mozorg/base-resp.html
+++ b/apps/mozorg/templates/mozorg/base-resp.html
@@ -267,3 +267,7 @@
   </div>
 </form>
 {% endblock %}
+
+{% block site_js %}
+  {{ js('mozorg-resp') }}
+{% endblock %}
diff --git a/media/css/contribute.less b/media/css/contribute.less
index e06b7329bf..d6f854ee0b 100644
--- a/media/css/contribute.less
+++ b/media/css/contribute.less
@@ -237,6 +237,14 @@
                 }
             }
         }
+        #newsletter-form {
+            .field-email input {
+                width: 260px;
+            }
+            .field-country select {
+                width: 280px;
+            }
+        }
     }
 
 }
diff --git a/media/css/sandstone/sandstone-resp.less b/media/css/sandstone/sandstone-resp.less
index 3a7870cd0c..a1530ba9d0 100644
--- a/media/css/sandstone/sandstone-resp.less
+++ b/media/css/sandstone/sandstone-resp.less
@@ -751,6 +751,7 @@ nav.menu-bar {
         }
 
         nav.breadcrumbs {
+            margin-left: 0;
             a,
             span {
                 margin-right: .3em;
@@ -974,7 +975,7 @@ nav.menu-bar {
     .container,
     .main-column,
     .sidebar {
-        width: @widthMobileLandscape - (@gridGutterWidth * 2);
+        width: auto;
     }
 
     .main-column,
diff --git a/settings/base.py b/settings/base.py
index 0e681c58fc..e326d10cd1 100644
--- a/settings/base.py
+++ b/settings/base.py
@@ -298,6 +298,11 @@ MINIFY_BUNDLES = {
             'js/mozilla-video-tools.js',
             'js/marketplace/partners.js',
         ),
+        'mozorg-resp': (
+            'js/libs/jquery-1.7.1.min.js',
+            'js/nav-main-resp.js',
+            'js/footer-email-form.js',
+        ),
         'pager': (
             'js/mozilla-pager.js',
         ),
diff --git a/templates/base-resp.html b/templates/base-resp.html
index c979f2656c..64de5c5866 100644
--- a/templates/base-resp.html
+++ b/templates/base-resp.html
@@ -166,49 +166,5 @@
      {% include "includes/webtrends.html" %}
     {% endblock %}
     
-<script>
-  // mobile dropdown menu
-  $("#nav-main .toggle").click(function() {
-    if ( $("#nav-main-menu").is(":visible") ) {
-      $("#nav-main-menu:visible").slideUp(100).attr("aria-expanded", "false");
-      $("#nav-main .toggle.open").removeClass("open");
-    }
-    else {
-      $("#nav-main-menu").slideToggle(150).attr("aria-expanded", "true");
-      $(this).toggleClass("open");
-    }
-    return false;
-  });
-
-/*
-  // Hide menu when anything else is clicked
-  $(document).bind('click', function(e) {
-    var $clicked = $(e.target);
-    if (! $clicked.parents("#nav-main"))
-      $("#nav-main-menu").hide().attr("aria-expanded", "false");
-      $("#nav-main .toggle").removeClass("open");
-  });
-  
-  // or gets focus
-  $("a, input, textarea, button, :focus").bind('focus', function(e) {
-    var $focused = $(e.target);
-    if (! $focused.parents("#nav-main")) {
-      $("#nav-main-menu").hide().attr("aria-expanded", "false");
-      $("#nav-main .toggle").removeClass("open");
-    }
-  });
-*/
-
-  // reset the menu for wider windows   
-  $(window).resize(function() {
-    if ( $(window).width() >= 761 ) {
-      $("#nav-main-menu").removeAttr("style").attr("aria-expanded", "true");
-    }
-    else if ( $(window).width() <= 760 ) {
-      $("#nav-main-menu").removeAttr("style").attr("aria-expanded", "false");
-    }
-  });
-  </script>
-    
   </body>
 </html>