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

@@ -267,3 +267,7 @@
   </div>
 </form>
 {% endblock %}
+
+{% block site_js %}
+  {{ js('mozorg-resp') }}
+{% endblock %}

media/css/contribute.less

@@ -237,6 +237,14 @@
                 }
             }
         }
+        #newsletter-form {
+            .field-email input {
+                width: 260px;
+            }
+            .field-country select {
+                width: 280px;
+            }
+        }
     }
 
 }

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,

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',
         ),

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>