Permalink
Browse files

Merge remote branch 'sgarrity-fork/bug-777525-partners'

Conflicts:
	apps/mozorg/templates/mozorg/partnerships.html
	media/css/sandstone/sandstone-resp.less
  • Loading branch information...
sgarrity committed Sep 20, 2012
2 parents e7f99e5 + 32cd6b2 commit 697bf297d9c01be3eae43471e570d454a384c905
@@ -1,16 +1,8 @@
-{% extends "mozorg/partnerships.html" %}
+{% extends "mozorg/base-resp.html" %}
{% block page_title %}Mozilla Partnerships{% endblock %}
{% block body_id %}partnerships{% endblock %}
-{% block extrahead %}
- {{ css('partnerships') }}
-{% endblock %}
-
-{% block js %}
- {{ js('partnerships') }}
-{% endblock %}
-
{% block breadcrumbs %}
<nav class="breadcrumbs">
<a href="{{ url('mozorg.home') }}">Home</a> >
@@ -1,4 +1,4 @@
-{% extends "mozorg/base.html" %}
+{% extends "mozorg/base-resp.html" %}
{% block page_title %}Mozilla Partnerships{% endblock %}
{% block body_id %}partnerships{% endblock %}
@@ -11,47 +11,71 @@
{{ js('partnerships') }}
{% endblock %}
-{% block breadcrumbs %}
- <nav class="breadcrumbs">
- <a href="{{ url('mozorg.home') }}">Home</a> >
- <a href="{{ url('mozorg.about') }}">About</a> >
- <span>Partnerships</span>
- </nav>
-{% endblock %}
-
{% block content %}
-<hgroup id="main-feature">
- <h1>Mozilla Partnerships</h1>
- <h2>Help Shape the Future of the Web</h2>
-</hgroup>
+<div id="main-feature">
+ <hgroup>
+ <h1 class="large">Partner with Mozilla</h1>
+ <h2>Help us shape the future of the Web for the public good</h2>
+ </hgroup>
+ <p>Mozilla promotes openness, innovation and opportunity on the Internet by engaging in unique partnerships with some of the world’s leading brands and non-profits, as well as with technology, content and service providers. Find out how you and your company can get involved.</p>
+</div>
+
+<article id="main-content" class="billboard">
+
+<div id="sections">
+
+<section id="firefox">
+ <img src="{{ media('/img/mozorg/partnerships/banner-firefox.jpg') }}" alt="Firefox screenshot" />
+ <img src="{{ media('/img/mozorg/partnerships/icon-firefox.png') }}" alt="Firefox icon" class="icon" />
+ <h3>Firefox for Desktop</h3>
+ <p>Opportunities include distribution, customized versions and more of our PC, Mac &amp; Linux browser. Learn more about <a href="{{ url('mozorg.partnerships-distribution') }}">Mozilla Firefox distribution policies »</a></p>
+</section>
+
+<section id="android">
+ <img src="{{ media('/img/mozorg/partnerships/banner-android.jpg') }}" alt="Firefox for Android screenshot" />
+ <img src="{{ media('/img/mozorg/partnerships/icon-android.png') }}" alt="Firefox for Android icon" class="icon" />
+ <h3>Firefox for Android</h3>
+ <p>Opportunities include distribution, customized versions and more of our mobile browser.</p>
+</section>
-<article id="main-content">
+<section id="marketplace">
+ <img src="{{ media('/img/mozorg/partnerships/banner-marketplace.jpg') }}" alt="Firefox Marketplace screenshot" />
+ <img src="{{ media('/img/mozorg/partnerships/icon-marketplace.png') }}" alt="Firefox Marketplace icon" class="icon" />
+ <h3>Firefox Marketplace</h3>
+ <p>Content providers and developers can reach Web users on desktop and mobile and have their apps promoted to hundreds of millions of users. <a href="{{ url('marketplace.marketplace') }}">Learn more about apps and the Firefox Marketplace »</a></p>
+</section>
+<section id="firefoxos">
+ <img src="{{ media('/img/mozorg/partnerships/banner-firefoxos.jpg') }}" alt="Firefox OS screenshot" />
+ <img src="{{ media('/img/mozorg/partnerships/icon-firefox.png') }}" alt="Firefox icon" class="icon" />
+ <h3>Firefox OS</h3>
+ <p>If you are a phone and tablet OEM/ODM or a mobile operator, talk to us about our new Web-based device platform.</p>
+</section>
+<section id="persona">
+ <img src="{{ media('/img/mozorg/partnerships/banner-persona.jpg') }}" alt="Persona screenshot" />
+ <img src="{{ media('/img/mozorg/partnerships/icon-persona.png') }}" alt="Persona icon" class="icon" />
+ <h3>Mozilla Persona</h3>
+ <p>Be part of our quick and easy sign-in system for the Web that provides the highest degree of user privacy and security. </p>
+</section>
-<section id="opportunities">
- <h3>Partnership Opportunities</h3>
- <p>Mozilla has developed a range of partnerships with some of the world’s leading search, commerce, content, technology and service providers. We continue to partner with new organizations and look forward to working with you.</p>
- <p>Mozilla offers many ways to partner including:</p>
- <ul>
- <li><strong>Mozilla Firefox</strong> – opportunities include distribution, customized versions, and more for our PC, Mac and Linux browser products. Learn more about <a href="{{ url('mozorg.partnerships-distribution') }}">Mozilla Firefox distribution policies</a>.</li>
- <li><strong>Mozilla Firefox Mobile</strong> – opportunities include distribution, promotions, customized versions and more.</li>
- <li><strong>Firefox Apps Marketplace</strong> – Combine the popularity of an app with the distribution of the Web. Mozilla is seeking app publishers and developers to distribute apps across our desktop and mobile platforms, with a starting audience of 450M people!</li>
- <li><strong>Mozilla Boot2Gecko</strong> – this is Mozilla’s new web based device platform. If you are a mobile device and tablet OEM’s/ODM’s, or a mobile operator, then we want to talk to you.</li>
- <li><strong>Mozilla Persona</strong> – Connect with Persona, the safest & easiest way to sign in into the Web. Persona is a federated login that provides the highest degree of user privacy and security. If you would like to integrate Persona on your website, please visit <a href="http://www.mozilla.org/en-US/persona/">mozilla.org/persona</a></li>
- <li><strong>Promotion or Marketing partnerships</strong> – Mozilla is always looking for marketing and promotion partnerships to drive user growth and loyalty. Reach out if there is a way to delight each other’s users.</li>
- <li><strong>Something else</strong> – If there is another partnership model or really cool idea you would like to discuss – contact us.</li>
- </ul>
+<section id="cobrand">
+ <img src="{{ media('/img/mozorg/partnerships/banner-cobrand.jpg') }}" alt="co-branding screenshot" />
+ <img src="{{ media('/img/mozorg/partnerships/icon-cobrand.png') }}" alt="co-branding icon" class="icon" />
+ <h3>Tell your brand story</h3>
+ <p>Co-branding, editorial partnerships, content creation, rewards, events and more — Mozilla is always looking for innovative marketing collaborations with like-minded brands.</p>
</section>
+</div>
+
<section id="partner">
{% if request.GET.success %}
<h3>Thank you</h3>
<p>We will review your request and get back to you as soon as possible.</p>
{% else %}
- <h3>Want to partner?</h3>
- <p>If you are interested in discussing a partnership with Mozilla, please complete the form below. Someone from our partnerships team will review your request and get back to you as soon as possible:</p>
+ <h3>Get started</h3>
+ <p>Please complete the form below. Our partnership team will review your request and get back to you as soon as possible</p>
<form action="https://www.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8" method="POST" id="sf-form">
@@ -121,14 +145,14 @@ <h3>Want to partner?</h3>
</div>
<div class="field">
- <label for="00NU0000002pDJr">Product Interest:</label>
- <select id="00NU0000002pDJr" multiple="multiple" name="00NU0000002pDJr" title="Product Interest">
- <option value="Firefox Desktop (PC/Mac/Linux)">Firefox Desktop (PC/Mac/Linux)</option>
- <option value="Firefox Mobile">Firefox Mobile</option>
- <option value="Firefox Apps Marketplace">Firefox Apps Marketplace</option>
- <option value="Firefox Boot2Gecko">Firefox Boot2Gecko</option>
- <option value="Firefox Personas">Firefox Personas</option><option value="Mozilla Toolbar">Mozilla Toolbar</option>
- <option value="Promotion/Marketing Program">Promotion/Marketing Program</option>
+ <label for="00NU0000002pDJr">Interest:</label>
+ <select id="00NU0000002pDJr" multiple="multiple" name="00NU0000002pDJr" title="Interest" size="7">
+ <option value="Firefox for Desktop">Firefox for Desktop</option>
+ <option value="Firefox for Android">Firefox for Android</option>
+ <option value="Firefox Marketplace">Firefox Marketplace</option>
+ <option value="Firefox OS">Firefox OS</option>
+ <option value="Persona">Persona</option>
+ <option value="Marketing and Co-promotions">Marketing and Co-promotions</option>
<option value="Other">Other</option>
</select>
</div>
View
@@ -1,14 +1,59 @@
-@import "sandstone/variables.less";
-@import "sandstone/mixins.less";
+@import "sandstone/variables-resp.less";
+@import "sandstone/mixins-resp.less";
-#opportunities {
- .span(6);
- margin-left: 0;
+#partnerships {
+ #main-feature {
+ text-align: center;
+ p,
+ hgroup {
+ margin-left: 90px;
+ margin-right: 90px;
+ }
+ p {
+ margin-bottom: 0;
+ }
+ }
+ #main-content {
+ background-image: url(/media/img/mozorg/partnerships/sidebar-bg.png);
+ background-position: 100% 0;
+ background-repeat: repeat-y;
+ }
+ #sections {
+ .span(9);
+ section {
+ .clearfix;
+ margin-right: 40px;
+ margin-bottom: @baseLine * 1.5;
+ position: relative;
+ background: url(/media/img/mozorg/partnerships/divider.png) 50% 100% no-repeat;
+ padding-bottom: @baseLine * 1.5;
+ p,
+ h3 {
+ .span(6);
+ margin-left: 0;
+ margin-bottom: 10px;
+ }
+ img {
+ width: 100%;
+ height: auto;
+ margin-bottom: @baseLine / 2;
+ &.icon {
+ width: auto;
+ position: absolute;
+ top: 60px;
+ right: 0;
+ }
+ }
+ &#cobrand {
+ background: none;
+ margin-bottom: 0;
+ }
+ }
+ }
}
#partner {
.span(3);
- .offset(1);
#sf-form label {
color: @textColorTertiary;
@@ -21,15 +66,15 @@
#sf-form input,
#sf-form select,
#sf-form textarea {
- width: 234px;
+ width: 200px
}
#sf-form select {
width : 100%;
}
#sf-form .footer-field input {
- width: 252px;
+ width: 218px;
}
#sf-form input.error {
@@ -51,3 +96,82 @@
.span(8);
margin-left: 0;
}
+
+/* Tablet Layout: 760px */
+@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
+
+ #partnerships {
+ #main-feature {
+ text-align: center;
+ p,
+ hgroup {
+ margin-left: 0;
+ margin-right: 0;
+ }
+ }
+ #sections {
+ .span_narrow(8);
+ section {
+ img.icon {
+ height: 150px;
+ width: 150px;
+ top: 10px;
+ }
+ h3 {
+ .span_narrow(5);
+ margin-left: 0;
+ margin-bottom: 10px;
+ }
+ p {
+ width: auto;
+ }
+ }
+ }
+
+ #partner {
+ .span_narrow(4);
+ }
+ }
+
+}
+
+/* Mobile layout: 320px */
+@media only screen and (max-width: @breakTablet) {
+
+ #partnerships {
+ #main-feature {
+ p,
+ hgroup {
+ margin-left: 10px;
+ margin-right: 10px;
+ }
+ }
+ #main-content {
+ background-image: none;
+ }
+ #sections {
+ width: auto;
+ float: none;
+ section {
+ margin-right: 0;
+ img.icon {
+ height: 80px;
+ width: 80px;
+ top: 10px;
+ }
+ h3,
+ p {
+ width: auto;
+ float: none;
+ clear: both;
+ }
+ }
+ }
+
+ #partner {
+ width: auto;
+ float: none;
+ }
+ }
+
+}
@@ -245,6 +245,8 @@ input[type=text] {
border-style: solid;
border-width: 1px;
@shadow: 0 1px rgba(255,255,255,0.5);
+ font-size: @smallFontSize;
+ .open-sans;
padding: (@baseLine / 6) (@baseLine / 3);
.border-radius(3px);
.box-shadow(@shadow);
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -340,6 +340,7 @@ def JINJA_CONFIG():
'partnerships': (
'js/libs/jquery.validate.js',
'js/partnerships.js',
+ 'js/mozilla-input-placeholder.js',
),
'styleguide': (
'js/styleguide.js',

0 comments on commit 697bf29

Please sign in to comment.