Merge pull request #3015 from mozilla/bug-1162755-pocket-landing-page

Bug 1161808 - Pocket landing page

bedrock/firefox/templates/firefox/pocket.html

@@ -0,0 +1,106 @@
+{# 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 %}{{ _('Pocket') }}{% endblock %}
+{% block body_id %}firefox-pocket{% endblock %}
+
+{% block page_css %}
+  {% stylesheet 'firefox_pocket' %}
+{% endblock %}
+
+{% block tabzilla_css %}{% endblock %}
+{% block tabzilla_js %}{% endblock %}
+
+{% block site_header %}
+    {% block tabzilla_tab %}
+    <div class="content">
+      <div id="tabzilla">
+        <a href="{{ url('mozorg.home') }}">Mozilla</a>
+      </div>
+    </div>
+    {% endblock %}
+    {% block site_header_nav %}{% endblock %}
+    {% block site_header_logo %}{% endblock %}
+    {% block breadcrumbs %}{% endblock %}
+{% endblock %}
+
+{% block content %}
+<main role="main">
+  <section class="content-main">
+    <div class="content">
+      <h1>{{ _('Pocket for Firefox') }}</h1>
+
+      <h2>
+        {{ _('Save it now. Read or watch it anytime, anywhere.') }}
+        <br>
+
+        {# Current Firefox #}
+        <span class="has-firefox">{{ _('All you need is your Firefox Account.') }}</span>
+
+        {# Old Firefox or Not Firefox #}
+        <span class="get-firefox">{{ _('Get Firefox to start using Pocket right in your browser.') }}</span>
+      </h2>
+
+      {# Has toolbar button #}
+      <p class="main-cta" id="cta-try"><a href="https://support.mozilla.org/kb/where-pocket-button-firefox" class="button-flat try-pocket">{{ _('Try it now') }}</a></p>
+
+      {# No toolbar button #}
+      <p class="main-cta" id="cta-learn"><a href="https://support.mozilla.org/kb/where-pocket-button-firefox" class="button-flat">{{ _('Learn more') }}</a></p>
+
+      {# Old Firefox or Not Firefox #}
+      <p class="main-cta" id="cta-download"><a href="{{ url('firefox.new') }}?scene=2#download-fx" class="button-flat-green">{{ _('Download Firefox') }}</a></p>
+
+    </div>
+  </section>
+
+  <section class="content-secondary">
+    <div class="content">
+      {# L10n: Pocket features below are emphasized with <strong></strong> #}
+      <ul>
+        <li class="save">
+          <h3>{{ _('Save it for later') }}</h3>
+          <p>{{ _('Short on time? Save articles, videos and more right from Firefox to view them later. It’s as simple as clicking the <strong>Pocket button</strong> in your toolbar.') }}</p>
+        </li>
+        <li class="view">
+          <h3>{{ _('View it anywhere') }}</h3>
+          <p>{{ _('On the go? Get the <strong>Pocket app</strong> to read your saved articles anywhere, anytime, on any device – even when you’re not connected to the Internet.') }}</p>
+        </li>
+        <li class="read">
+          <h3>{{ _('Read it easier') }}</h3>
+          <p>{{ _('Want a cleaner reading experience? Use Pocket’s <strong>Article View</strong> for a beautiful format that lets you focus on what you’re reading, free of distractions.') }}</p>
+        </li>
+      </ul>
+    </div>
+  </section>
+
+</main>
+{% endblock %}
+
+{% block email_form %}{% 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 js %}
+  {% javascript 'firefox_pocket' %}
+{% endblock %}

bedrock/firefox/urls.py

@@ -93,6 +93,9 @@
     page('firefox/os/devices/tv', 'firefox/os/tv.html',
         decorators=waffle_switch('firefox-os-tv')),
 
+    page('firefox/pocket', 'firefox/pocket.html',
+        decorators=waffle_switch('pocket-active')),
+
     page('firefox/independent', 'firefox/independent.html'),
 
     # Release notes

bedrock/settings/static_media.py

@@ -510,6 +510,14 @@
         ),
         'output_filename': 'css/firefox_whatsnew_37-bundle.css',
     },
+    'firefox_pocket': {
+        'source_filenames': (
+            'css/sandstone/sandstone-resp.less',
+            'css/tabzilla/tabzilla-static.less',
+            'css/firefox/pocket.less',
+        ),
+        'output_filename': 'css/firefox_pocket-bundle.css',
+    },
     'firefox_releasenotes': {
         'source_filenames': (
             'css/sandstone/sandstone-resp.less',
@@ -1201,6 +1209,13 @@
         ),
         'output_filename': 'js/firefox_independent-bundle.js',
     },
+    'firefox_pocket': {
+        'source_filenames': (
+            'js/firefox/australis/australis-uitour.js',
+            'js/firefox/pocket.js',
+        ),
+        'output_filename': 'js/firefox_pocket-bundle.js',
+    },
     'firefox_os': {
         'source_filenames': (
             'js/base/mozilla-modal.js',

etc/httpd/global.conf

@@ -894,3 +894,6 @@ RewriteRule ^/(\w{2,3}(?:-\w{2})?/)?firefox/products(/?)$ /b/$1firefox/products$
 # bug 1123399
 RewriteRule ^/(\w{2,3}(?:-\w{2})?/)?thunderbird/all\.html?$ /$1thunderbird/all/ [L,R=301]
 RewriteRule ^/(\w{2,3}(?:-\w{2})?/)?thunderbird/all(/?)$ /b/$1thunderbird/all$2 [PT]
+
+# bug 1162755
+RewriteRule ^/(\w{2,3}(?:-\w{2})?/)?firefox/pocket(/?)$ /b/$1firefox/pocket$2 [PT]