Bug 1133004. Fx family landing page.

bedrock/base/templates/base-resp.html

@@ -104,7 +104,7 @@
           <ul id="nav-main-menu">
             <li class="first mission-item"><a href="{{ url('mozorg.mission') }}">{{_('Mission')}}</a></li>
             <li class="about-item"><a href="{{ url('mozorg.about') }}">{{_('About')}}</a></li>
-            <li class="products-item"><a href="{{ url('mozorg.products') }}">{{_('Products')}}</a></li>
+            <li class="products-item"><a href="{{ url('firefox.family.index') }}">{{_('Products')}}</a></li>
             <li class="last contribute-item"><a href="{{ url('mozorg.contribute') }}">{{_('Get Involved')}}</a></li>
           </ul>
         </nav>

bedrock/base/templates/base.html

@@ -98,7 +98,7 @@
             <ul>
                 <li><a href="{{ url('mozorg.mission') }}">{{_('Mission')}}</a></li>
                 <li><a href="{{ url('mozorg.about') }}">{{_('About')}}</a></li>
-                <li><a href="{{ url('mozorg.products') }}">{{_('Products')}}</a></li>
+                <li><a href="{{ url('firefox.family.index') }}">{{_('Products')}}</a></li>
                 <li><a href="{{ url('mozorg.contribute') }}">{{_('Get Involved')}}</a></li>
             </ul>
         </nav>

bedrock/firefox/templates/firefox/family/index.html

@@ -0,0 +1,154 @@
+{# This Source Code Form is subject to the terms of the Mozilla Public
+ # License, v. 2.0. If a copy of the MPL was not distributed with this
+ # file, You can obtain one at http://mozilla.org/MPL/2.0/. -#}
+
+{% extends "firefox/base-resp.html" %}
+
+{% block page_title_prefix %}{% endblock %}
+{% block page_title %}{{ _('Firefox — Desktop browser, Android, OS, Hello, Sync, Marketplace') }}{% endblock %}
+{% block page_desc %}{{ _('Learn more about our complete lineup of products for desktop and mobile browsing (and more) that help keep you in control online. Free yourself with Firefox.') }}{% endblock %}
+
+{% block site_css %}
+  {% stylesheet 'firefox_family' %}
+{% endblock %}
+
+{% block extrahead %}
+  {{ super() }}
+<!--[if lt IE 8]>
+  {% stylesheet 'firefox_family_ie' %}
+<![endif]-->
+{% endblock %}
+
+{% block tabzilla_css %}{% endblock %}
+{% block tabzilla_js %}{% endblock %}
+
+{% block body_class %}mozid{% endblock %}
+
+{% block site_header %}{% endblock %}
+
+{% block content %}
+<div id="conditional-download-bar">
+  <div class="content">
+    <div class="message" id="dlbar-oldfx-desktop">
+      {{ _('You’re using an older version of Firefox for desktop.') }}
+      {{ _('Update today to stay fast and safe.') }}
+      <a class="button-flat btn-download" href="{{ url('firefox.new') }}" data-product="Firefox for Desktop, outdated Firefox">{{ _('Download') }}</a>
+    </div>
+    <div class="message" id="dlbar-nonfx">
+      {{ _('Choose Independent.') }}
+      {{ _('Choose Firefox.') }}
+      <a class="button-flat btn-download" href="{{ url('firefox.new') }}" data-product="Firefox for Desktop, other browser">{{ _('Download') }}</a>
+    </div>
+    <div class="message" id="dlbar-nonfx-android">
+      <a rel="external" href="{{ settings.GOOGLE_PLAY_FIREFOX_LINK }}" data-product="Firefox for Android">{{ _('Get Firefox for Android') }}</a>
+    </div>
+    <div class="message" id="dlbar-ios">
+      {{ _('Firefox is coming soon to iOS! <a href="%s">Sign up to learn more</a>.')|format(url('newsletter.ios')) }}
+    </div>
+
+    <button type="button" class="btn-close button-flat" title="{{ _('Close') }}">{{ _('Close') }}</button>
+  </div>{#-- /.content --#}
+</div>{#-- /#conditional-download-bar --#}
+
+<header id="header">
+  <div class="content">
+    <div id="moztab">
+      <a href="{{ url('mozorg.home') }}">Mozilla</a>
+    </div>
+
+    <h1>
+    {% if LANG.startswith('en') %}
+      <span><b>Free</b> yourself</span> with {{ high_res_img('img/firefox/family/index/firefox-wordmark.png', {'alt': 'Firefox', 'width': '330', 'height': '95'}) }}
+    {% else %}
+      {{ _('Free yourself with %s')|format(high_res_img('img/firefox/family/index/firefox-wordmark.png', {'alt': 'Firefox', 'width': '330', 'height': '95'})) }}
+    {% endif %}
+    </h1>
+  </div>{#-- /.content --#}
+</header>{#-- /#header --#}
+
+<section id="products-primary">
+  <div class="content">
+    <ul class="product-list">
+      <li class="product" id="product-desktop">
+        <a href="{{ url('firefox.desktop.index') }}" data-product="Firefox for Desktop">
+          {# L10n: <span> tag below adds visual style to "for" text #}
+          <h2>{{ _('Firefox <span>for</span> desktop') }}</h2>
+          <p>{{ _('Trusted. Flexible. Fast.') }}</p>
+        </a>
+      </li>
+
+      <li class="product highlight" id="product-android">
+        <a href="{{ url('firefox.android.index') }}" data-product="Firefox for Android">
+          {# L10n: span below adds visual style to "for" text #}
+          <h2>{{ _('Firefox <span>for</span> Android') }}</h2>
+          <p>{{ _('Make it uniquely yours.') }}</p>
+        </a>
+
+        <a rel="external" href="{{ settings.GOOGLE_PLAY_FIREFOX_LINK }}" class="btn-google-play" data-product="Firefox for Android, Google Play">
+          {{ high_res_img('firefox/android/btn-google-play.png', {'alt': 'Get it on Google Play', 'width': '129', 'height': '45', 'l10n': True}) }}
+        </a>
+      </li>
+
+      <li class="product" id="product-fxos">
+        <a href="{{ url('firefox.os.index') }}" data-product="Firefox OS">
+          <h2>{{ _('Firefox OS') }}</h2>
+          <p>{{ _('Get just what you need.') }}</p>
+        </a>
+      </li>
+    </ul>
+  </div>{#-- /.content --#}
+</section>{#-- /#products-primary --#}
+
+<section id="products-secondary">
+  <div class="content">
+    <ul class="product-list">
+      <li class="product" id="product-hello">
+        <a href="{{ url('firefox.hello') }}" data-product="Firefox Hello">
+          <h2>{{ _('Firefox Hello') }}</h2>
+          <p>{{ _('Free, easy video conversations.') }}</p>
+        </a>
+      </li>
+
+      <li class="product" id="product-sync">
+        <a href="{{ url('firefox.sync') }}" data-product="Firefox Sync">
+          <h2>{{ _('Sync') }}</h2>
+          <p>{{ _('Connect Firefox wherever you use it.') }}</p>
+        </a>
+      </li>
+
+      <li class="product" id="product-marketplace">
+        <a rel="external" href="https://marketplace.firefox.com/" data-product="Firefox Marketplace">
+          <h2>{{ _('Firefox Marketplace') }}</h2>
+          <p>{{ _('Discover and download Web apps.') }}</p>
+        </a>
+      </li>
+    </ul>
+  </div>{#-- /.content --#}
+</section>{#-- /#products-secondary --#}
+{% endblock %}
+
+{% block site_footer %}
+<footer id="footer">
+  <div class="content">
+    <a class="mozlogo" href="{{ url('mozorg.home') }}">Mozilla</a>
+
+    <ul>
+      <li>
+        <a href="{{ url('privacy') }}">{{ _('Privacy Policy') }}</a>
+      </li>
+      <li>
+        <a href="{{ url('privacy.notices.websites') }}#cookies">{{ _('Cookies') }}</a>
+      </li>
+      <li>
+        <a href="{{ url('legal.index') }}">{{ _('Legal Notices') }}</a>
+      </li>
+    </ul>
+  </div>
+</footer>
+{% endblock %}
+
+{% block email_form %}{% endblock %}
+
+{% block js %}
+  {% javascript 'firefox_family_index' %}
+{% endblock  %}

bedrock/firefox/urls.py

@@ -44,6 +44,7 @@
     page('firefox/android', 'firefox/android/index.html'),
     page('firefox/android/faq', 'firefox/android/faq.html'),
     page('firefox/os/faq', 'firefox/os/faq.html'),
+    page('firefox/products', 'firefox/family/index.html'),
     url('^firefox/sms/$', views.sms_send, name='firefox.sms'),
     page('firefox/sms/sent', 'firefox/android/sms-thankyou.html'),
     page('firefox/sync', 'firefox/sync.html'),

bedrock/foundation/templates/foundation/index.html

@@ -27,7 +27,7 @@ <h1 class="page-title">{{ _('The Mozilla Foundation') }}</h1>
   <p>
     {% trans
       firefox=url('firefox.new'),
-      projects=url('mozorg.products'),
+      projects=url('firefox.family.index'),
       grants=url('grants'),
       webmaker="https://webmaker.org/"
     %}

bedrock/foundation/templates/foundation/trademarks/faq.html

@@ -51,7 +51,7 @@ <h1 class="page-title">{{ _('Mozilla Trademark Policy FAQ') }}</h1>
 
     <dt>{% trans %}Can I distribute any of the Mozilla software from my website, by CD, or to my friends, employees or students?{% endtrans %}</dt>
     <dd>
-      <p>{% trans binaries=url('mozorg.products'), mpl=php_url('/MPL') %}<strong>If you are redistributing unchanged
+      <p>{% trans binaries=url('firefox.family.index'), mpl=php_url('/MPL') %}<strong>If you are redistributing unchanged
         <a href="{{ binaries }}">official stable binaries</a>
         downloaded from mozilla.org, to anyone in any way and for any
         purpose, no further permissions are required from us.</strong>
@@ -140,7 +140,7 @@ <h1 class="page-title">{{ _('Mozilla Trademark Policy FAQ') }}</h1>
 
   <p>{% trans trademarks=url('foundation.trademarks.index'), styleguide=url('styleguide.home') %}
       If your question isn't covered here, time to move on to
-      <a href="{{ trademarks }}">one of the other Trademark Policy documents</a> 
+      <a href="{{ trademarks }}">one of the other Trademark Policy documents</a>
       or the <a href="{{ styleguide }}">Mozilla Style Guide</a>.
   {% endtrans %}</p>
 

bedrock/mozorg/templates/mozorg/about-base.html

@@ -44,7 +44,7 @@
   <div class="reference">
     <h4>{{ _('Our Products') }}</h4>
     <p>{{ _('Software and other innovations designed to advance our mission.') }}</p>
-    <a class="more" href="{{ url('mozorg.products') }}">{{ _('Learn More') }}</a>
+    <a class="more" href="{{ url('firefox.family.index') }}">{{ _('Learn More') }}</a>
   </div>
 
   <div class="reference">

bedrock/mozorg/templates/mozorg/about.html

@@ -94,7 +94,7 @@ <h4><a href="{{ url('mozorg.about.leadership') }}">{{ _('Mozilla leadership') }}
     </li>
     {% endif %}
     <li>
-      <h4><a href="{{ url('mozorg.products') }}">{{ _('Our products') }}</a></h4>
+      <h4><a href="{{ url('firefox.family.index') }}">{{ _('Our products') }}</a></h4>
       <p>{{ _('An overview of what we make and what we’re working on') }}</p>
     </li>
     <li>

bedrock/mozorg/templates/mozorg/about/history-details.html

@@ -42,7 +42,7 @@ <h1 class="title-shadow-box">{{ _('History of the Mozilla Project') }}</h1>
       {% trans mission='http://www-archive.mozilla.org/mission.html',
                browsers='http://www.oreillynet.com/pub/a/mozilla/2002/09/12/mozilla_browsers.html',
                bugzilla='http://www.bugzilla.org',
-               projects=url('mozorg.products')
+               projects=url('firefox.family.index')
       %}
         Community members got involved and expanded the scope of the project’s
         <a href="{{ mission }}">original mission</a> — instead of just working

bedrock/mozorg/templates/mozorg/about/history.html

@@ -286,7 +286,7 @@ <h4><a href="{{ url('mozorg.about.history-details') }}">{{ _('More history') }}<
       <p>{{ _('Where we came from and how we got to where we are') }}</p>
     </li>
     <li>
-      <h4><a href="{{ url('mozorg.products') }}">{{ _('Our products') }}</a></h4>
+      <h4><a href="{{ url('firefox.family.index') }}">{{ _('Our products') }}</a></h4>
       <p>{{ _('An overview of what we make and what we’re working on') }}</p>
     </li>
     <li>

bedrock/mozorg/templates/mozorg/projects/mozilla-based.html

@@ -10,7 +10,7 @@
 {% block breadcrumbs %}
   <nav class="breadcrumbs">
     <a href="{{ url('mozorg.home') }}">{{ _('Home') }}</a> >
-    <a href="{{ url('mozorg.products') }}">{{ _('Products') }}</a> >
+    <a href="{{ url('firefox.family.index') }}">{{ _('Products') }}</a> >
     <span>{{ _('Mozilla-Based Applications') }}</span>
   </nav>
 {% endblock %}