Skip to content
Browse files

Merge pull request #243 from craigcook/responsify-mozorg

Responsify mozorg pages, now from a cleaner, up-to-date base branch
  • Loading branch information...
2 parents bc46661 + 1f2d0e9 commit ee81556e11a853da772286c01c94cfb040eb0930 @sgarrity sgarrity committed
View
2 apps/mozorg/templates/mozorg/about-base.html
@@ -1,4 +1,4 @@
-{% extends "mozorg/base.html" %}
+{% extends "mozorg/base-resp.html" %}
{% block content %}
View
2 apps/mozorg/templates/mozorg/about.html
@@ -1,4 +1,4 @@
-{% extends "/mozorg/base.html" %}
+{% extends "/mozorg/base-resp.html" %}
{% block page_title %}Get to Know Mozilla{% endblock %}
{% block body_id %}about{% endblock %}
View
4 apps/mozorg/templates/mozorg/base-resp.html
@@ -267,3 +267,7 @@
</div>
</form>
{% endblock %}
+
+{% block site_js %}
+ {{ js('mozorg-resp') }}
+{% endblock %}
View
18 apps/mozorg/templates/mozorg/contribute-form.html
@@ -29,7 +29,9 @@
</ul>
{% endif %}
- <div class="row">
+<fieldset>
+
+ <div class="form-row">
<div class="form-column-1">
<h3>{{_('Want to help?')}}</h3>
</div>
@@ -43,11 +45,9 @@
{{ form.interest|safe }}
</div>
</div>
- <div class="form-submit">
- <input type="submit" class="button-blue" id="form-submit" value="{{_('Submit&nbsp;»')}}">
- </div>
</div>
- <div class="row" id="form-details">
+
+ <div class="form-row" id="form-details">
<div class="form-column-1">
<p>{{_('Send us a note and we can get you started right away.')}}</p>
</div>
@@ -70,7 +70,13 @@
{{ form.captcha }}
</div>
</div>
- </div>
+
+</fieldset>
+
+ <div class="form-submit">
+ <input type="submit" class="button-blue" id="form-submit" value="{{_('Submit&nbsp;»')}}">
+ </div>
+
</form>
{% else %}
<div id="help-form" class="billboard thank">
View
3 apps/mozorg/templates/mozorg/contribute-page.html
@@ -1,7 +1,8 @@
-{% extends "sand.html" %}
+{% extends "base-resp.html" %}
{% block page_title %}{{_('Contribute to our sites')}}{% endblock %}
{% block body_id %}contribute-page{% endblock %}
+{% block body_class %}sand{% endblock %}
{% block extrahead %}
{{ css('contribute-page') }}
View
14 apps/mozorg/templates/mozorg/contribute.html
@@ -1,4 +1,4 @@
-{% extends "mozorg/base.html" %}
+{% extends "mozorg/base-resp.html" %}
{% block page_title %}{{_('Get Involved: Volunteer Opportunities at Mozilla')}}{% endblock %}
{% block body_id %}contribute{% endblock %}
@@ -117,37 +117,37 @@ <h3 id="marketing">{{_('Spread the Word')}}</h3>
<ul>
<li class="row">
<a href="/contribute/local/northamerica.html">
- <img src="/media/img/contribute/local/map-th-northamerica.png" alt="{{_('map')}}">
+ <img src="/media/img/contribute/local/map-th-northamerica.png" alt="">
<h3>{{_('US and Canada')}}</h3>
</a>
</li>
<li class="row">
<a href="/contribute/local/europe.html">
- <img src="/media/img/contribute/local/map-th-europe.png" alt="{{_('map')}}">
+ <img src="/media/img/contribute/local/map-th-europe.png" alt="">
<h3>{{_('Europe')}}</h3>
</a>
</li>
<li class="row">
<a href="/contribute/local/latinamerica.html">
- <img src="/media/img/contribute/local/map-th-latinamerica.png" alt="{{_('map')}}">
+ <img src="/media/img/contribute/local/map-th-latinamerica.png" alt="">
<h3>{{_('Latin America')}}</h3>
</a>
</li>
<li class="row">
<a href="/contribute/local/africamideast.html">
- <img src="/media/img/contribute/local/map-th-africamideast.png" alt="{{_('map')}}">
+ <img src="/media/img/contribute/local/map-th-africamideast.png" alt="">
<h3>{{_('Africa and the Middle East')}}</h3>
</a>
</li>
<li class="row">
<a href="/contribute/local/asia.html">
- <img src="/media/img/contribute/local/map-th-asia.png" alt="{{_('map')}}">
+ <img src="/media/img/contribute/local/map-th-asia.png" alt="">
<h3>{{_('Asia and the South Pacific')}}</h3>
</a>
</li>
<li class="row">
<a href="/contribute/local/southpole.html">
- <img src="/media/img/contribute/local/map-th-southpole.png" alt="{{_('map')}}">
+ <img src="/media/img/contribute/local/map-th-southpole.png" alt="">
<h3>{{_('Antarctica')}}</h3>
</a>
</li>
View
66 media/css/about.less
@@ -1,5 +1,5 @@
-@import "sandstone/variables.less";
-@import "sandstone/mixins.less";
+@import "sandstone/variables-resp.less";
+@import "sandstone/mixins-resp.less";
#main-content {
@@ -9,12 +9,11 @@
.intro {
.span(4);
- margin-left: 0;
padding-top: @baseLine;
}
ul.links {
- .span(3);
+ .span(4);
li {
list-style-type: none;
margin-left: 0;
@@ -36,3 +35,62 @@
}
}
+
+/* Tablet Layout: 760px */
+@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
+
+ #main-content {
+ .intro {
+ .span_narrow(4);
+ }
+
+ ul.links {
+ .span_narrow(4);
+ h4 {
+ font-size: 20px;
+ }
+ }
+
+ }
+
+}
+
+/* Mobile layout: 320px */
+@media only screen and (max-width: @breakTablet) {
+
+ #main-content {
+ margin-bottom: @baseLine;
+ .intro {
+ width: auto;
+ }
+
+ ul.links {
+ width: auto;
+ margin-bottom: 0;
+ li {
+ min-height: 0;
+ }
+ }
+
+ }
+
+}
+
+/* Wide mobile layout: 480px; */
+@media only screen and (min-width: @breakMobileLandscape) and (max-width: @breakTablet) {
+
+ #main-content {
+ .intro {
+ .span(2);
+ }
+
+ ul.links {
+ .span(3);
+ float: right;
+ clear: right;
+ }
+
+ }
+
+
+}
View
63 media/css/contribute-form.less
@@ -2,6 +2,12 @@
padding-top: @baseLine;
padding-bottom: @baseLine;
margin-bottom: @baseLine * 2;
+
+ fieldset,
+ .form-row {
+ width: (@gridColumnWidth * 10) + (@gridGutterWidth * 10);
+ float: left;
+ }
.form-column-1 {
.span(2);
@@ -12,22 +18,23 @@
}
.form-column-2 {
- .span(3);
+ .span(4);
}
.form-column-3 {
- .span(3);
+ .span(4);
}
.form-submit {
.span(2);
+ float: right;
}
.field-interest {
min-height: 36px;
select {
margin-top: 4px;
- width: 100%;
+ width: 90%;
}
}
@@ -37,11 +44,12 @@
textarea,
input[type=email] {
- width: (@gridColumnWidth * 3) + (@gridGutterWidth * 2) - 20px;
+ width: 90%;
}
input[type=submit] {
width: (@gridColumnWidth * 2) + (@gridGutterWidth);
+ max-width: 100%;
}
.field-newsletter label,
@@ -69,3 +77,50 @@
}
.js #form-details { display: none; }
+
+/* Tablet Layout: 760px */
+@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
+
+ #help-form {
+ fieldset,
+ .form-row {
+ width: (@gridColumnWidthNarrow * 10) + (@gridGutterWidth * 10);
+ float: left;
+ }
+ .form-column-1,
+ .form-submit {
+ .span_narrow(2);
+ }
+ .form-column-2,
+ .form-column-3 {
+ .span_narrow(4);
+ }
+
+ }
+
+}
+
+
+/* Mobile Layout: 320px */
+@media only screen and (max-width: @breakTablet) {
+
+ #help-form {
+ padding-left: @gridGutterWidth;
+ padding-right: @gridGutterWidth;
+ fieldset,
+ .form-row {
+ width: auto;
+ float: none;
+ }
+ .form-column-1,
+ .form-column-2,
+ .form-column-3,
+ .form-submit {
+ width: auto;
+ float: none;
+ margin: 0 0 .5em;
+ }
+
+ }
+
+}
View
53 media/css/contribute-page.less
@@ -1,15 +1,56 @@
-@import "sandstone/variables.less";
-@import "sandstone/mixins.less";
+@import "sandstone/variables-resp.less";
+@import "sandstone/mixins-resp.less";
@import "contribute-form.less";
#contribute-page {
#main-feature {
- padding-top: @baseLine;
- padding-bottom: @baseLine;
+ padding: @baseLine (@gridGutterWidth * 1.5);
}
#main-content p {
- .span(7);
- margin-left: 0;
+ .span(8);
clear: left;
+ margin: 0 (@gridGutterWidth / 2) @baseLine;
}
}
+
+/* Tablet Layout: 760px */
+@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
+
+ #contribute-page {
+ #main-content p {
+ .span_narrow(10);
+ margin: 0 (@gridGutterWidth / 2) @baseLine;
+ }
+ }
+
+}
+
+/* Mobile layout: 320px */
+@media only screen and (max-width: @breakTablet) {
+
+ #contribute-page {
+ #main-feature {
+ padding: @baseLine @gridGutterWidth;
+ }
+ #main-content p {
+ width: auto;
+ margin: 0 (@gridGutterWidth / 2) @baseLine;
+ }
+ }
+
+}
+
+/* Wide Mobile Layout: 480px */
+@media only screen and (min-width: @breakMobileLandscape) and (max-width: @breakTablet) {
+
+ #contribute-page {
+ #main-feature {
+ padding: @baseLine 0;
+ }
+ #main-content p {
+ width: auto;
+ margin: 0 0 @baseLine;
+ }
+ }
+
+}
View
156 media/css/contribute.less
@@ -1,5 +1,5 @@
-@import "sandstone/variables.less";
-@import "sandstone/mixins.less";
+@import "sandstone/variables-resp.less";
+@import "sandstone/mixins-resp.less";
@import "contribute-form.less";
#contribute {
@@ -34,9 +34,17 @@
font-weight: bold;
}
}
+
+ li.row {
+ margin-left: 0;
+ }
#opportunities {
padding-bottom: @baseLine * 2;
+ .container {
+ padding-left: @gridGutterWidth * 1.5;
+ padding-right: @gridGutterWidth * 1.5;
+ }
nav {
background: #f0ece3;
border: 1px solid rgba(0,0,0,0.03);
@@ -89,35 +97,34 @@
.border-radius;
.box-shadow(0 2px 4px rgba(0,0,0,0.1));
float: left;
- margin: @baseLine 0 @baseLine @gridGutterWidth;
+ margin: @baseLine 10px @baseLine 0;
}
h3 {
- float: left;
- margin: @baseLine * 1.25 @gridGutterWidth @baseLine @gridGutterWidth;
- width: (@gridColumnWidth * 3) + (@gridGutterWidth * 2);
+ .span(3);
+ margin-top: @baseLine * 1.25;
}
.content {
- float: left;
- margin: @baseLine 0 0 0;
- width: (@gridColumnWidth * 6) + (@gridGutterWidth * 5);
+ .span(7);
+ margin-top: @baseLine * 1.25;
}
}
- .location-content section {
- li {
+ .location-content {
+ li.row {
float: left;
+ margin-right: @gridGutterWidth;
border: 0;
}
img {
- width: 142px;
+ width: 130px;
}
h3 {
width: (@gridColumnWidth * 3) + (@gridGutterWidth * 2);
- margin: @baseLine * 2 0 0 @gridGutterWidth;
+ margin: (@baseLine * 2) 0 0 (@gridGutterWidth / 2);
}
}
}
@@ -141,3 +148,126 @@
.js #form-details { display: none; }
+/* Tablet Layout: 760px */
+@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
+
+
+ #contribute {
+ #opportunities {
+ section {
+ img {
+ width: 30px;
+ }
+
+ h3 {
+ .span_narrow(4);
+ margin-top: @baseLine * 1.25;
+ }
+
+ .content {
+ .span_narrow(7);
+ margin-top: @baseLine;
+ }
+ }
+
+ .location-content {
+
+ h3 {
+ font-size: 1.5em;
+ width: (@gridColumnWidthNarrow * 3) + (@gridGutterWidth * 2);
+ margin: (@baseLine * 1.5) 0 0 10px;
+ }
+ }
+
+ }
+ }
+
+}
+
+/* Mobile Layout: 320px */
+@media only screen and (max-width: @breakTablet) {
+
+ #contribute {
+ #opportunities {
+ .container {
+ padding-left: @gridGutterWidth;
+ padding-right: @gridGutterWidth;
+ }
+ section {
+ img {
+ float: left;
+ }
+ h3 {
+ width: auto;
+ }
+ .content {
+ width: auto;
+ margin: 0 10px;
+ }
+ }
+
+ .location-content {
+ li.row {
+ margin: 0 0 (@baseLine * 1.5);
+ width: 100%;
+ float: none;
+ }
+ img {
+ display: block;
+ float: none;
+ margin: 0 auto .5em;
+ }
+ h3 {
+ margin: 0;
+ width: auto;
+ float: none;
+ text-align: center;
+ }
+ }
+
+ nav {
+ h5,
+ ul {
+ display: block;
+ margin: 0 0 .5em;
+ }
+ li {
+ display: inline;
+ margin: 0 3px .25em 0;
+ }
+ }
+ }
+ #newsletter-form {
+ .field-email input {
+ width: 260px;
+ }
+ .field-country select {
+ width: 280px;
+ }
+ }
+ }
+
+}
+
+/* Wide Mobile Layout: 480px */
+@media only screen and (min-width: @breakMobileLandscape) and (max-width: @breakTablet) {
+
+ #contribute {
+ #opportunities .location-content {
+ li.row {
+ margin: 0;
+ }
+ img {
+ float: left;
+ margin: @baseLine (@gridGutterWidth / 2);
+ }
+ h3 {
+ width: (@gridColumnWidthNarrow * 4) + (@gridGutterWidth * 3);
+ float: left;
+ text-align: left;
+ margin: (@baseLine * 1.5) 0 0 10px;
+ }
+ }
+ }
+
+}
View
36 media/css/mission.less
@@ -1,20 +1,50 @@
-@import "sandstone/variables.less";
-@import "sandstone/mixins.less";
+@import "sandstone/variables-resp.less";
+@import "sandstone/mixins-resp.less";
.main-column {
- .span(7);
+ .span(8);
}
.sidebar {
+ .span(3);
.offset(1);
}
#welcome-video {
margin: @baseLine auto;
width: 640px;
+ max-width: 100%;
video {
width: 100%;
height: auto;
}
}
+/* Tablet Layout: 760px */
+@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
+
+ .main-column {
+ .span_narrow(9);
+ }
+
+ .sidebar {
+ .span_narrow(3);
+ .offset(0);
+ }
+
+}
+
+/* Mobile layout: 320px */
+@media only screen and (max-width: @breakTablet) {
+
+ .main-column,
+ .sidebar {
+ width: auto;
+ .offset(0);
+ }
+
+ #welcome-video {
+ width: 100%;
+ }
+
+}
View
19 media/css/sandstone/sandstone-resp.less
@@ -582,9 +582,8 @@ nav.menu-bar {
margin: 1em 0 0;
.row {
- width: @gridRowWidth;
+ width: @gridRowWidth + @gridGutterWidth;
margin: 0 auto;
- padding: 0 @gridGutterWidth;
.clearfix;
}
@@ -650,6 +649,10 @@ nav.menu-bar {
.container {
width: @widthTablet - (@gridGutterWidth * 2);
}
+
+ nav.menu-bar {
+ font-size: .9375em;
+ }
.sidebar {
.offset(0);
@@ -672,9 +675,7 @@ nav.menu-bar {
#colophon {
.row {
- width: @gridRowWidthTablet;
- padding-left: @gridGutterWidth / 2;
- padding-right: @gridGutterWidth / 2;
+ width: @gridRowWidthTablet + @gridGutterWidth;
}
.footer-logo {
.span_narrow(4);
@@ -750,6 +751,7 @@ nav.menu-bar {
}
nav.breadcrumbs {
+ margin-left: 0;
a,
span {
margin-right: .3em;
@@ -802,6 +804,7 @@ nav.menu-bar {
padding-bottom: @baseLine / 2;
li {
display: block;
+ padding: 0;
a {
padding: @baseLine / 2;
border: 0;
@@ -831,7 +834,7 @@ nav.menu-bar {
#colophon {
.row {
- width: auto;
+ width: @gridRowWidthMobile + @gridGutterWidth;
padding: 0;
}
.footer-logo,
@@ -972,7 +975,7 @@ nav.menu-bar {
.container,
.main-column,
.sidebar {
- width: @widthMobileLandscape - @gridGutterWidth;
+ width: auto;
}
.main-column,
@@ -983,7 +986,7 @@ nav.menu-bar {
#colophon {
.row {
- width: auto;
+ width: @widthMobileLandscape - @gridGutterWidth;
padding: 0;
}
}
View
4 media/css/sandstone/variables-resp.less
@@ -45,7 +45,9 @@
@gridColumnsMobile: 5;
@gridRowWidthMobile: (@gridColumnsMobile * @gridColumnWidthNarrow) + (@gridGutterWidth * (@gridColumnsMobile - 1));
-@gridRowWidthMobileWide: (@gridColumnsMobile * @gridColumnWidth) + (@gridGutterWidth * (@gridColumnsMobile - 1));
+// Mobile landscape grid: 7 columns at 40px
+@gridColumnsMobileWide: 7;
+@gridRowWidthMobileWide: (@gridColumnsMobileWide * @gridColumnWidthNarrow) + (@gridGutterWidth * (@gridColumnsMobileWide - 1));
// Breakpoints for common devices
@breakDesktop: 1000px;
View
131 media/css/sandstone/video-resp.less
@@ -0,0 +1,131 @@
+@import "variables-resp.less";
+@import "mixins-resp.less";
+
+/* {{{ Video Control */
+
+.mozilla-video-control {
+ position: relative;
+}
+
+a.mozilla-video-control-overlay {
+ top: 0;
+ left: 0;
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ background: #000;
+ opacity: 0.25;
+ display: none;
+ text-align: center;
+ background: transparent url(/media/img/sandstone/video/play.png) center center no-repeat;
+}
+
+.mozilla-video-shadow {
+ background-image: url(/media/img/sandstone/video/shadow.png);
+ background-repeat: no-repeat;
+ background-position: 50% 100%;
+ background-size: 100% 15px;
+ padding-bottom: 15px;
+}
+
+/* }}} */
+/* {{{ Video Launcher */
+
+.mozilla-video-player-overlay {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ background: #444;
+ background: -webkit-gradient(radial,center center,0,center center,100%,from(#fff), to(#000));
+ background: -webkit-radial-gradient(center center, rgba(255,255,255,1) 0, rgba(0,0,0,0.9) 100%);
+ background: -moz-radial-gradient(center center, rgba(255,255,255,1) 0, rgba(0,0,0,0.9) 100%);
+ background: radial-gradient(center center, rgba(255,255,255,1) 0, rgba(0,0,0,0.9) 100%);
+ z-index: 500;
+ outline: 0;
+ cursor: default;
+}
+
+.mozilla-video-player-window {
+ position: fixed;
+ left: 50%; /* for centering */
+ margin-left: -320px; /* for centering */
+ top: 0;
+ width: 640px;
+ z-index: 1000;
+ background: #333;
+ background: rgba(0,0,0,0.8);
+ -webkit-border-radius: 8px;
+ -moz-border-radius: 8px;
+ border-radius: 8px;
+ -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.8); /* ye-olde WebKit */
+ -webkit-box-shadow: 0 3px 70px rgba(0, 0, 0, 0.8), 0 0 10px rgba(0,0,0,0.5);
+ -moz-box-shadow: 0 3px 70px rgba(0, 0, 0, 0.8), 0 0 10px rgba(0,0,0,0.5);
+ box-shadow: 0 3px 70px rgba(0, 0, 0, 0.8), 0 0 10px rgba(0,0,0,0.5);
+}
+
+.mozilla-video-player-content {
+ overflow: hidden;
+}
+
+* html .mozilla-video-player-window {
+}
+
+.mozilla-video-player-content video {
+ display: block;
+}
+
+.mozilla-video-player-no-flash {
+ width: 600px;
+ height: 260px;
+ margin: auto;
+ padding: 100px 20px 0 20px;
+ text-align: left;
+}
+
+.mozilla-video-player-link,
+.mozilla-video-player-close {
+ text-align: right;
+}
+
+.mozilla-video-player-link a,
+.mozilla-video-player-close a {
+ display: block;
+ height: 32px;
+ width: 32px;
+ margin: 0 0 0 auto;
+ overflow: hidden;
+ line-height: 200px;
+ background: url(/media/img/sandstone/video/clothes-lol.png) no-repeat 50% 50%;
+}
+
+.mozilla-video-player-link a {
+ padding-right: 10px;
+ background: none;
+}
+
+.mozilla-video-player-content .video-download-links {
+ text-align: center;
+ font-family: "Trebuchet MS",sans-serif;
+ font-size: 11px;
+}
+
+.mozilla-video-player-content .video-download-links ul {
+ margin: 0;
+ padding: 1em;
+}
+
+.mozilla-video-player-content .video-download-links ul li {
+ background: none;
+ display: inline;
+ margin: 0 0.5em;
+}
+
+.mozilla-video-player-content .video-download-links a,
+.mozilla-video-player-content .video-download-links a:link,
+.mozilla-video-player-content .video-download-links a:hover {
+ color: #888;
+}
+
+/* }}} */
+
View
2 media/js/nav-main-resp.js
@@ -357,7 +357,7 @@ NavMain.openSmallMenu = function()
}
$('#nav-main-menu')
- .slideToggle(150)
+ .slideDown(150)
.removeAttr('aria-hidden');
$('#nav-main .toggle').addClass('open');
View
60 media/js/nav-main.js
@@ -78,68 +78,8 @@ $(document).ready(function() {
});
});
-if ( $(window).width() <= 760 ) {
-
- // 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;
- });
-
- $("#nav-main-menu a[aria-haspopup='true']").click(function(){
- if ( $(this).next(".submenu").is(":visible") ) {
- $(this).next(".submenu").slideUp(100).attr("aria-expanded", "false");
- }
- else {
- $(this).next(".submenu").slideDown(150).attr("aria-expanded", "true");
- }
- 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, #nav-main-menu .submenu").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, #nav-main-menu .submenu").hide().attr("aria-expanded", "false");
- $("#nav-main .toggle").removeClass("open");
- }
- });
-*/
-
-
-} // endif
-
- // reset the menu for wider windows
- $(window).resize(function() {
- if ( $(window).width() >= 761 ) {
- $("#nav-main-menu").removeAttr("style").removeAttr("aria-hidden");
- }
- else if ( $(window).width() <= 760 ) {
- $("#nav-main-menu").removeAttr("style").attr("aria-hidden", "true");
- }
- });
-
-
-
// With JavaScript enabled, we can provide a full navigation with #nav-main.
// Now "hide" the duplicated #footer-menu from AT.
$('#footer-menu').attr('role', 'presentation');
-
});
View
7 settings/base.py
@@ -171,7 +171,7 @@ def JINJA_CONFIG():
'css/marketplace.less',
),
'mission': (
- 'css/sandstone/video.less',
+ 'css/sandstone/video-resp.less',
'css/mission.less',
),
'mozilla_expanders': (
@@ -305,6 +305,11 @@ def JINJA_CONFIG():
'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',
),
View
44 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>

0 comments on commit ee81556

Please sign in to comment.
Something went wrong with that request. Please try again.