зеркало из https://github.com/mozilla/bedrock.git
[fix bug 1370587] Move sync page to Fx hub
This commit is contained in:
Jon Petto
Родитель
e557c8b41a
Коммит
4689cfa532
|
|
@ -39,7 +39,7 @@ supervisord.log
|
|||
.env
|
||||
.cache
|
||||
tests/functional/results.html
|
||||
tests/functional/assets/style.css
|
||||
tests/functional/assets
|
||||
.eslintcache
|
||||
.docker-build*
|
||||
Dockerfile-*
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ redirectpatterns = (
|
|||
to_kwargs={'channel': 'organizations'}),
|
||||
|
||||
# bug 729329
|
||||
redirect(r'^mobile/sync', 'firefox.sync'),
|
||||
redirect(r'^mobile/sync', 'firefox.features.sync'),
|
||||
|
||||
# bug 882845
|
||||
redirect(r'^firefox/toolkit/download-to-your-devices', 'firefox.new'),
|
||||
|
|
@ -139,7 +139,7 @@ redirectpatterns = (
|
|||
|
||||
# Bug 1110927
|
||||
redirect(r'^(products/)?firefox/start/central\.html$', 'firefox.new'),
|
||||
redirect(r'^firefox/sync/firstrun\.html$', 'firefox.sync'),
|
||||
redirect(r'^firefox/sync/firstrun\.html$', 'firefox.features.sync'),
|
||||
|
||||
# Bug 920212
|
||||
redirect(r'^firefox/fx/?$', 'firefox.new'),
|
||||
|
|
@ -299,7 +299,7 @@ redirectpatterns = (
|
|||
redirect(r'^firefox/os(/.*)?$', 'https://support.mozilla.org/products/firefox-os'),
|
||||
|
||||
# Bug 1252332
|
||||
redirect(r'^sync/?$', 'firefox.sync'),
|
||||
redirect(r'^sync/?$', 'firefox.features.sync'),
|
||||
|
||||
# Bug 424204
|
||||
redirect(r'^firefox/help/?$', 'https://support.mozilla.org/'),
|
||||
|
|
@ -539,4 +539,7 @@ redirectpatterns = (
|
|||
|
||||
# bug 1369732
|
||||
redirect(r'^Firefox/?$', 'firefox'),
|
||||
|
||||
# bug 1370587
|
||||
redirect(r'^firefox/sync/?', 'firefox.features.sync'),
|
||||
)
|
||||
|
|
|
|||
|
|
@ -373,7 +373,7 @@
|
|||
{{ _('Use Sync on your smartphone or tablet to access whatever you need from your desktop — and vice versa — without having to remember URLs.') }}
|
||||
</p>
|
||||
|
||||
<a href="{{ url('firefox.sync') }}">{{ _('Learn more about Sync') }}</a>
|
||||
<a href="{{ url('firefox.features.sync') }}">{{ _('Learn more about Sync') }}</a>
|
||||
</div>
|
||||
<div class="content-secondary">
|
||||
{% include 'firefox/includes/sync-animation.html' %}
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
<p>{{ _('You don’t have to start over. Access your history, bookmarks and more.')}}</p>
|
||||
</header>
|
||||
<div class="sync-cta">
|
||||
<a href="{{ url('firefox.sync') }}" class="button" data-link-type="button" data-link-name="Get started with Sync">{{ _('Get started with Sync') }}</a>
|
||||
<a href="{{ url('firefox.features.sync') }}" class="button" data-link-type="button" data-link-name="Get started with Sync">{{ _('Get started with Sync') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sync-anim-wrapper">
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@
|
|||
|
||||
<div class="rightcol">
|
||||
{{ high_res_img('firefox/australis/fx38.0.5/sync.png', {'alt': 'Firefox Sync', 'width': '219', 'height': '118'}) }}
|
||||
<a href="{{ url('firefox.sync') }}" id="cta-signup" class="button button-green">{{ _('Create a Firefox Account') }}</a>
|
||||
<a href="{{ url('firefox.features.sync') }}" id="cta-signup" class="button button-green">{{ _('Create a Firefox Account') }}</a>
|
||||
<a id="cta-signin" rel="external" href="https://support.mozilla.org/kb/how-do-i-set-up-firefox-sync">{{ _('Already have one? Sign in.') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
<p>{{ _('Access your bookmarks, passwords and more from any device.')}}</p>
|
||||
</header>
|
||||
<div class="sync-cta">
|
||||
<a href="{{ url('firefox.sync') }}" class="button" data-link-type="button" data-link-name="Get started with Sync">{{ _('Get started with Sync') }}</a>
|
||||
<a href="{{ url('firefox.features.sync') }}" class="button" data-link-type="button" data-link-name="Get started with Sync">{{ _('Get started with Sync') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sync-anim-wrapper">
|
||||
|
|
|
|||
|
|
@ -246,7 +246,7 @@
|
|||
|
||||
{% include 'firefox/includes/sync-animation.html' %}
|
||||
|
||||
<a class="button" id="sync-button" href="http://www.mozilla.org/mobile/sync/" data-link-type="button" data-link-name="Learn more about Sync" data-cta-position="Secondary"><span></span>{{ _('Learn more about Sync') }}</a>
|
||||
<a class="button" id="sync-button" href="{{ url('firefox.features.sync') }}" data-link-type="button" data-link-name="Learn more about Sync" data-cta-position="Secondary"><span></span>{{ _('Learn more about Sync') }}</a>
|
||||
<br>
|
||||
<a class="more" rel="external" data-interaction="outbound link" href="https://support.mozilla.org/kb/how-do-i-set-up-firefox-sync">{{ _('Get help with Sync') }}</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -139,7 +139,7 @@
|
|||
<div class="content">
|
||||
<ul class="product-list">
|
||||
<li class="product" id="product-sync">
|
||||
<a href="{{ url('firefox.sync') }}" data-link-type="button" data-link-name="Sync">
|
||||
<a href="{{ url('firefox.features.sync') }}" data-link-type="button" data-link-name="Sync">
|
||||
<h2>{{ _('Sync') }}</h2>
|
||||
<p>{{ _('Connect Firefox wherever you use it.') }}</p>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@
|
|||
</a>
|
||||
</li>
|
||||
<li class="sync">
|
||||
<a class="fxfeature-link" href="{{ url('firefox.sync') }}">
|
||||
<a class="fxfeature-link" href="{{ url('firefox.features.sync') }}">
|
||||
<h2>{{ _('Sync') }}</h2>
|
||||
|
||||
<p class="copy">
|
||||
|
|
|
|||
|
|
@ -72,13 +72,13 @@
|
|||
</p>
|
||||
</li>
|
||||
<li class="features-list-item">
|
||||
<a href="{{ url('firefox.sync') }}" data-link-type="link" data-link-name="Sync Between Devices" data-link-position="modern 4">
|
||||
<a href="{{ url('firefox.features.sync') }}" data-link-type="link" data-link-name="Sync Between Devices" data-link-position="modern 4">
|
||||
{{ lazy_image('sync.jpg') }}
|
||||
<h3>{{ _('Sync between devices') }}</h3>
|
||||
</a>
|
||||
<p>{{ _('Get your tabs, logins and history on the go.') }}</p>
|
||||
<p>
|
||||
<a href="{{ url('firefox.sync') }}" class="cta-link" data-link-type="link" data-link-name="Sync Between Devices" data-link-position="modern 4">
|
||||
<a href="{{ url('firefox.features.sync') }}" class="cta-link" data-link-type="link" data-link-name="Sync Between Devices" data-link-position="modern 4">
|
||||
{{ _('Use Firefox everywhere') }}
|
||||
</a>
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,71 @@
|
|||
{# 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/. -#}
|
||||
|
||||
{% from "macros.html" import google_play_button with context %}
|
||||
|
||||
{% extends "/firefox/features/sync.html" %}
|
||||
|
||||
{% block intro %}
|
||||
<div class="show-fx-31-signed-in">
|
||||
<strong>Browse boldly. Connect your devices.</strong>
|
||||
<p>
|
||||
Add Firefox on your personal devices to get your bookmarks, open tabs and
|
||||
passwords anywhere. Get secure access to everything you need when you sign
|
||||
into your Firefox Account.
|
||||
</p>
|
||||
</div>
|
||||
<div class="show-fx-31-signed-out show-fx-android">
|
||||
<strong>Your web, how you like it, everywhere</strong>
|
||||
<p>
|
||||
Sign into your Firefox Account to access your protected passwords, open
|
||||
tabs and bookmarks. Add Firefox to your personal devices and securely
|
||||
connect your browsing experience everywhere. Keep everything set up how
|
||||
you like it, wherever you go.
|
||||
</p>
|
||||
</div>
|
||||
<div class="show-not-fx show-default">
|
||||
<strong>If you lived here you'd be home by now</strong>
|
||||
<p>
|
||||
Download or open Firefox to start securely connecting your browsing
|
||||
experience on all your personal devices. Sign into your Firefox Account to
|
||||
access your protected passwords, open tabs and bookmarks. Keep everything
|
||||
set up how you like it, wherever you go.
|
||||
</p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block features_ul %}
|
||||
<ul class="features-list">
|
||||
<li class="features-list-item">
|
||||
<img src="{{ static('img/firefox/features/thumbnails/sync/personal.jpg') }}" alt="">
|
||||
<h3>Personal</h3>
|
||||
<p>
|
||||
That shopping rabbit hole you started on your laptop this morning? Pick
|
||||
up where you left off on your phone tonight. That dinner recipe you
|
||||
discovered at lunchtime? Open it on your kitchen tablet, instantly.
|
||||
Connect your personal devices, securely.
|
||||
</p>
|
||||
</li>
|
||||
<li class="features-list-item">
|
||||
<img src="{{ static('img/firefox/features/thumbnails/sync/secure.jpg') }}" alt="">
|
||||
<h3>Secure</h3>
|
||||
<p>
|
||||
Your Firefox Account is the doorway to all your web stuff—we help you
|
||||
keep it safe. Your data is always in your control, unreadable by anyone
|
||||
else, and encrypted with your account password. We protect it and hand
|
||||
you the key.
|
||||
</p>
|
||||
</li>
|
||||
<li class="features-list-item">
|
||||
<img src="{{ static('img/firefox/features/thumbnails/sync/accessible.jpg') }}" alt="">
|
||||
<h3>Accessible</h3>
|
||||
<p>
|
||||
Catch up on your open tabs and saved reads over Saturday morning coffee.
|
||||
Find your bookmarks and passwords anywhere you use Firefox—your
|
||||
smartphone, tablet or laptop. Connect everything you need and nothing
|
||||
you don’t.
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
{% endblock %}
|
||||
|
|
@ -0,0 +1,165 @@
|
|||
{# 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/. -#}
|
||||
|
||||
{% from "macros.html" import google_play_button with context %}
|
||||
|
||||
{% add_lang_files "firefox/shared" "firefox/sync" %}
|
||||
|
||||
{% extends "firefox/features/base.html" %}
|
||||
|
||||
{% block page_title %}
|
||||
{% if l10n_has_tag('firefox_title_meta_bug1345338') %}
|
||||
{{ _('Use Bookmarks, Tabs and Passwords Across Devices | Firefox') }}
|
||||
{% else %}
|
||||
{{ _('Keep your Firefox in sync') }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block page_desc %}
|
||||
{% if l10n_has_tag('firefox_title_meta_bug1345338') %}
|
||||
{{ _('Bring your Firefox bookmarks, tabs, or passwords wherever you go with Firefox Sync. Share between computers and mobile devices. Get Firefox now!') }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block page_css %}
|
||||
{{ super() }}
|
||||
{% stylesheet 'firefox-features-hub-detail' %}
|
||||
{% stylesheet 'firefox-features-sync' %}
|
||||
{% endblock %}
|
||||
|
||||
{% block body_id %}firefox-features-sync{% endblock %}
|
||||
|
||||
{% block body_class %}
|
||||
{{ super() }}
|
||||
state-default
|
||||
{% endblock %}
|
||||
|
||||
{% block features_header_image %}
|
||||
{{ high_res_img('firefox/features/sync-hero.png', {'class': 'hero-image', 'alt': '', 'width': '700', 'height': '390'}) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block features_header_content %}
|
||||
<h1><span>{{ _('Firefox Sync') }}</span></h1>
|
||||
{% endblock %}
|
||||
|
||||
{% block features_list %}
|
||||
<section>
|
||||
<div class="content">
|
||||
<h2 class="section-title"><span>{{ _('Sync') }}</span></h2>
|
||||
|
||||
<div id="sync-intro-copy-cta-wrapper">
|
||||
<div id="sync-intro-copy">
|
||||
{# Warning Text #}
|
||||
<div class="show-fx-30-older warning">
|
||||
<p>
|
||||
<span>{{ _('It looks like you’re running an older version of Firefox.') }}</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="show-not-fx warning">
|
||||
<p>
|
||||
<span>
|
||||
{% if l10n_has_tag('firefox_sync_non_fx') %}
|
||||
{{ _('Sync is just one of the great features you’ll only get with Firefox.') }}
|
||||
{% else %}
|
||||
{{ _('Sync is just one of the great features you’ll only get with Firefox. Discover them all!') }}
|
||||
{% endif %}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{% block intro %}
|
||||
<div class="show-fx-31-signed-in">
|
||||
<h1>{{ _('Ready, Set, Sync') }}</h1>
|
||||
<p>
|
||||
{{ _('You’re signed up and ready to access <em>your</em> Firefox anywhere, anytime.') }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="show-fx-31-signed-out show-fx-android show-not-fx show-default">
|
||||
<h1>{{ _('Take your Web with you') }}</h1>
|
||||
<p>
|
||||
{{ _('Sync Firefox wherever you use it to access your bookmarks, passwords, tabs and more from any smartphone, tablet or computer.') }}
|
||||
</p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
</div>{#--/#sync-intro-copy--#}
|
||||
|
||||
<div id="sync-intro-cta">
|
||||
<div class="show-fx-31-signed-in">
|
||||
<ul class="primary-buttons">
|
||||
<li>
|
||||
{{ google_play_button(id='cta-android', anchor_attributes={'data-download-location': 'other'}) }}
|
||||
</li>
|
||||
<li>
|
||||
<a href="{{ firefox_ios_url('mozorg-sync_page-appstore-button') }}" data-link-type="download" data-download-os="iOS" data-download-location="other" id="cta-ios">
|
||||
<img src="{{ l10n_img('firefox/ios/btn-app-store.svg') }}" alt="{{ _('Download on the App Store') }}" width="152" height="45">
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p class="button-footer">
|
||||
<a href="https://support.mozilla.org/kb/how-do-i-set-up-firefox-sync" class="ga-link" data-interaction="outbound link click">
|
||||
{{ _('Need help?') }}
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="show-fx-31-signed-out">
|
||||
<button class="button button-hollow" data-button-name="Get started with Sync" data-cta-position="Primary" id="cta-sync">
|
||||
{{ _('Get started with Sync') }}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="show-fx-30-older">
|
||||
<a href="https://support.mozilla.org/kb/update-firefox-latest-version" class="button button-hollow" data-interaction="button click" data-element-action="Sync CTA" id="cta-update">
|
||||
{{ _('Update your Firefox') }}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="show-not-fx">
|
||||
{{ download_firefox(button_color='button-arrow', download_location='other') }}
|
||||
</div>
|
||||
</div>{#--/#sync-intro-cta--#}
|
||||
</div>{#--/#sync-intro-copy-cta-wrapper--#}
|
||||
</div>{#--/.content--#}
|
||||
</section>
|
||||
|
||||
<section class="features-list-section">
|
||||
<div class="content">
|
||||
<h2 class="section-title"><span>{{ _('Features') }}</span></h2>
|
||||
|
||||
{% block features_ul %}
|
||||
<ul class="features-list">
|
||||
<li class="features-list-item">
|
||||
<img src="{{ static('img/firefox/features/thumbnails/sync/personal.jpg') }}" alt="">
|
||||
<h3>{{ _('At home') }}</h3>
|
||||
<p>
|
||||
{{ _('Move from your desk to the couch without skipping a beat. Access your open tabs on your smartphone, or keeping browsing your bookmarks right on your tablet.') }}
|
||||
</p>
|
||||
</li>
|
||||
<li class="features-list-item">
|
||||
<img src="{{ static('img/firefox/features/thumbnails/sync/secure.jpg') }}" alt="">
|
||||
<h3>{{ _('At work') }}</h3>
|
||||
<p>
|
||||
{{ _('Stay connected to all of your important information. Sync the passwords and bookmarks that you might need to access at any time. Just like Firefox, it’s safe as can be.') }}
|
||||
</p>
|
||||
</li>
|
||||
<li class="features-list-item">
|
||||
<img src="{{ static('img/firefox/features/thumbnails/sync/accessible.jpg') }}" alt="">
|
||||
<h3>{{ _('On the go') }}</h3>
|
||||
<p>
|
||||
{{ _('Keep up with your favorite sites, or finish that story you started at home — wherever you go. With Sync, it’s never been easier.') }}
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
{% endblock %}
|
||||
|
||||
</div> {#--/.content--#}
|
||||
</section>
|
||||
{% endblock %}
|
||||
|
||||
{% block js %}
|
||||
{{ super() }}
|
||||
{% javascript 'firefox-features-sync' %}
|
||||
{% endblock %}
|
||||
|
|
@ -54,7 +54,7 @@
|
|||
|
||||
<div class="secondary">
|
||||
<aside class="action-secondary cta-sync">
|
||||
<a data-name="CTA Firefox Sync" href="{{ url('firefox.sync') }}?utm_source=happyheartbeat&utm_medium=heartbeat&utm_content=SyncCTA&utm_campaign=Sync">
|
||||
<a data-name="CTA Firefox Sync" href="{{ url('firefox.features.sync') }}?utm_source=happyheartbeat&utm_medium=heartbeat&utm_content=SyncCTA&utm_campaign=Sync">
|
||||
<h2>{{ _('Stay in Sync') }}</h2>
|
||||
<p>{{ _('Sign in or sign up to sync your Firefox tabs, bookmarks, passwords and more.') }}</p>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
<div id="left-divider">
|
||||
<h1 id="title">{{_('Already using Firefox?')}}</h1>
|
||||
<p>{{_('Sign in to your account and we’ll sync the bookmarks, passwords and other great things you’ve saved to Firefox on other devices.')}}</p>
|
||||
<a href="{{ url('firefox.sync') }}">{{_('Learn more about Firefox Accounts')}}</a>
|
||||
<a href="{{ url('firefox.features.sync') }}">{{_('Learn more about Firefox Accounts')}}</a>
|
||||
</div>
|
||||
<div id="firefox-logo"></div>
|
||||
{# Bug 1354710: firstrun pages need to pass funnelcake parameters to FxA #}
|
||||
|
|
|
|||
|
|
@ -200,7 +200,7 @@
|
|||
<div id="sync-card" class="card image-card">
|
||||
<div class="card-content-wrapper">
|
||||
<div class="card-content">
|
||||
<a href="{{ url('firefox.sync') }}" data-link-name="Check out Firefox Sync" data-link-type="link" data-link-position="Firefox Sync">
|
||||
<a href="{{ url('firefox.features.sync') }}" data-link-name="Check out Firefox Sync" data-link-type="link" data-link-position="Firefox Sync">
|
||||
<h2 class="card-heading">{{ _('Take Firefox to go!') }}</h2>
|
||||
</a>
|
||||
|
||||
|
|
@ -212,7 +212,7 @@
|
|||
{% endtrans %}
|
||||
</p>
|
||||
|
||||
<a href="{{ url('firefox.sync') }}" class="cta-link" data-link-name="Check out Firefox Sync" data-link-type="link" data-link-position="Firefox Sync">
|
||||
<a href="{{ url('firefox.features.sync') }}" class="cta-link" data-link-name="Check out Firefox Sync" data-link-type="link" data-link-position="Firefox Sync">
|
||||
{{ _('Check out Firefox Sync') }}
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
<li><a href="{{ url('firefox.developer') }}" tabindex="-1" data-link-type="nav" data-link-name="Firefox: Developer Edition">{{ _('Developer Edition') }}</a></li>
|
||||
<li>
|
||||
<hr>{# <hr> before first sub/minor link #}
|
||||
<a class="sublink" href="{{ url('firefox.sync') }}" tabindex="-1" data-link-type="nav" data-link-name="Firefox: Sync">{{ _('Sync') }}</a>
|
||||
<a class="sublink" href="{{ url('firefox.features.sync') }}" tabindex="-1" data-link-type="nav" data-link-name="Firefox: Sync">{{ _('Sync') }}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -95,7 +95,7 @@
|
|||
<div class="sync-cta">
|
||||
|
||||
<div class="default">
|
||||
<p><a href="{{ url('firefox.sync') }}" class="button" data-link-type="button" data-link-name="Learn more about Sync" data-cta-position="Secondary">{{ _('Learn more about Sync') }}</a></p>
|
||||
<p><a href="{{ url('firefox.features.sync') }}" class="button" data-link-type="button" data-link-name="Learn more about Sync" data-cta-position="Secondary">{{ _('Learn more about Sync') }}</a></p>
|
||||
</div>
|
||||
|
||||
<div class="fx-signed-out">
|
||||
|
|
@ -105,7 +105,7 @@
|
|||
|
||||
<div class="fx-signed-in">
|
||||
<h3>{{ _('You’re already signed in!') }}</h3>
|
||||
<p><a href="{{ url('firefox.sync') }}" class="go" data-link-type="button" data-link-name="Learn more about Sync" data-cta-position="Secondary">{{ _('Learn more about Sync') }}</a></p>
|
||||
<p><a href="{{ url('firefox.features.sync') }}" class="go" data-link-type="button" data-link-name="Learn more about Sync" data-cta-position="Secondary">{{ _('Learn more about Sync') }}</a></p>
|
||||
</div>
|
||||
|
||||
<div class="fx-ios">
|
||||
|
|
|
|||
|
|
@ -1,69 +0,0 @@
|
|||
{# 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/. -#}
|
||||
|
||||
{% from "macros.html" import fxfamilynav, google_play_button with context %}
|
||||
|
||||
{% extends "/firefox/sync.html" %}
|
||||
|
||||
{% block banner %}
|
||||
<header role="banner" class="intro container">
|
||||
<div class="show-fx-31-signed-in">
|
||||
<h1>Browse boldly. <br>Connect your devices.</h1>
|
||||
<p>
|
||||
Add Firefox on your personal devices to get your bookmarks, open tabs and passwords anywhere. Get secure access to everything you need when you sign into your Firefox Account.
|
||||
</p>
|
||||
</div>
|
||||
<div class="show-fx-31-signed-out show-fx-29-30 show-fx-28-older show-fx-android">
|
||||
<h1>Your web, how you like it, everywhere</h1>
|
||||
<p>
|
||||
Sign into your Firefox Account to access your protected passwords, open tabs and bookmarks. Add Firefox to your personal devices and securely connect your browsing experience everywhere. Keep everything set up how you like it, wherever you go.
|
||||
</p>
|
||||
</div>
|
||||
<div class="show-not-fx show-default">
|
||||
<h1>If you lived here <br>you'd be home by now</h1>
|
||||
<p>
|
||||
Download or open Firefox to start securely connecting your browsing experience on all your personal devices. Sign into your Firefox Account to access your protected passwords, open tabs and bookmarks. Keep everything set up how you like it, wherever you go.
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
{% endblock %}
|
||||
|
||||
{% block not_fx_warning %}{% endblock %}
|
||||
|
||||
{% block mobile_buttons_text %}
|
||||
<p>Add Firefox to more devices now.</p>
|
||||
{% endblock %}
|
||||
|
||||
{% block features %}
|
||||
<header>
|
||||
<h2>Your account. Your choice.</h2>
|
||||
<p>
|
||||
Control how much—or how little—of your account data you share between devices. Sync your open tabs or access all your passwords and history anywhere you log in to Firefox; your personal data is private and for your eyes only—even we can’t see it.
|
||||
</p>
|
||||
</header>
|
||||
<div class="features">
|
||||
<div class="feature-home">
|
||||
<h3>Personal</h3>
|
||||
<p>
|
||||
That shopping rabbit hole you started on your laptop this morning? Pick up where you left off on your phone tonight. That dinner recipe you discovered at lunchtime? Open it on your kitchen tablet, instantly. Connect your personal devices, securely.
|
||||
</p>
|
||||
</div>
|
||||
<div class="feature-work">
|
||||
<h3>Secure</h3>
|
||||
<p>
|
||||
Your Firefox Account is the doorway to all your web stuff—we help you keep it safe. Your data is always in your control, unreadable by anyone else, and encrypted with your account password. We protect it and hand you the key.
|
||||
</p>
|
||||
</div>
|
||||
<div class="feature-go">
|
||||
<h3>Accessible</h3>
|
||||
<p>
|
||||
Catch up on your open tabs and saved reads over Saturday morning coffee. Find your bookmarks and passwords anywhere you use Firefox—your smartphone, tablet or laptop. Connect everything you need and nothing you don’t.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block everywhere_copy %}
|
||||
Download Firefox to the devices you use and sign into your account to securely connect the passwords, tabs and bookmarks you need. Done and done.
|
||||
{% endblock %}
|
||||
|
|
@ -1,290 +0,0 @@
|
|||
{# 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/. -#}
|
||||
|
||||
{% from "macros.html" import fxfamilynav, google_play_button with context %}
|
||||
|
||||
{% extends "/firefox/base-resp.html" %}
|
||||
|
||||
{% block page_title_prefix %}{% endblock %}
|
||||
{% block page_title_suffix %}{% endblock %}
|
||||
{% block page_title %}
|
||||
{% if l10n_has_tag('firefox_title_meta_bug1345338') %}
|
||||
{{ _('Use Bookmarks, Tabs and Passwords Across Devices | Firefox') }}
|
||||
{% else %}
|
||||
{{ _('Keep your Firefox in sync') }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block page_desc %}
|
||||
{% if l10n_has_tag('firefox_title_meta_bug1345338') %}
|
||||
{{ _('Bring your Firefox bookmarks, tabs, or passwords wherever you go with Firefox Sync. Share between computers and mobile devices. Get Firefox now!') }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block body_id %}firefox-sync{% endblock %}
|
||||
{% block body_class %}
|
||||
{{ super() }}
|
||||
state-default
|
||||
{% endblock %}
|
||||
|
||||
{% block page_css %}
|
||||
{% stylesheet 'firefox_sync' %}
|
||||
{% stylesheet 'firefox_sync_anim' %}
|
||||
{% endblock %}
|
||||
|
||||
{% block site_header %}{% endblock %}
|
||||
|
||||
{% block site_header_unwrapped %}
|
||||
{{ fxfamilynav('features', 'dark') }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{% include 'firefox/includes/sync-animation.html' %}
|
||||
|
||||
{% block banner %}
|
||||
<header role="banner" class="intro container">
|
||||
<div class="show-fx-31-signed-in">
|
||||
<h1>{{ _('Ready, Set, Sync') }}</h1>
|
||||
<p>
|
||||
{{ _('You’re signed up and ready to access <em>your</em> Firefox anywhere, anytime.') }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="show-fx-31-signed-out show-fx-29-30 show-fx-28-older show-fx-android show-not-fx show-default">
|
||||
<h1>{{ _('Take your Web with you') }}</h1>
|
||||
<p>
|
||||
{{ _('Sync Firefox wherever you use it to access your bookmarks, passwords, tabs and more from any smartphone, tablet or computer.') }}
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
{% endblock %}
|
||||
|
||||
<section class="primary">
|
||||
<div class="inner-wrapper">
|
||||
<div class="container">
|
||||
|
||||
{# Warning Text #}
|
||||
<div class="show-fx-29-30 warning">
|
||||
<p>
|
||||
{{ _('It looks like you’re running an older version of Firefox.') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="show-fx-28-older warning">
|
||||
<p>
|
||||
{{ _('The new version of Sync only works with the latest version of Firefox') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{% block not_fx_warning %}
|
||||
<div class="show-not-fx warning">
|
||||
<p>
|
||||
{% if l10n_has_tag('firefox_sync_non_fx') %}
|
||||
{{ _('Sync is just one of the great features you’ll only get with Firefox.') }}
|
||||
{% else %}
|
||||
{{ _('Sync is just one of the great features you’ll only get with Firefox. Discover them all!') }}
|
||||
{% endif %}
|
||||
</p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{# Primary Buttons #}
|
||||
|
||||
<div class="buttons">
|
||||
<div class="show-fx-31-signed-in">
|
||||
{% block mobile_buttons_text %}
|
||||
{% if l10n_has_tag('firefox_sync_mobile_buttons_update') %}
|
||||
<p>
|
||||
{{ _('Now sync Firefox with your iOS and Android devices.') }}
|
||||
</p>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
<ul class="primary-buttons">
|
||||
<li>
|
||||
{{ google_play_button(id='cta-android') }}
|
||||
</li>
|
||||
<li>
|
||||
<a href="{{ firefox_ios_url('mozorg-sync_page-appstore-button') }}" data-link-type="download" data-download-os="iOS" id="cta-ios">
|
||||
<img src="{{ l10n_img('firefox/ios/btn-app-store.svg') }}" alt="{{ _('Download on the App Store') }}" width="152" height="45">
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<p class="button-footer">
|
||||
<a href="https://support.mozilla.org/kb/how-do-i-set-up-firefox-sync" class="ga-link" data-interaction="outbound link click">
|
||||
{{ _('Need help?') }}
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="show-fx-31-signed-out">
|
||||
{% if not version %}
|
||||
<button class="button" data-button-name="Get started with Sync" data-cta-position="Primary" id="cta-sync">
|
||||
{{ _('Get started with Sync') }}
|
||||
</button>
|
||||
{% else %}
|
||||
<form id="fxa-email-form" action="{{ url('firefox.accounts') }}" method="get">
|
||||
<input type="hidden" id="variation" name="v" value="{{ version }}">
|
||||
<label for="fxa-email" class="fxa-email">
|
||||
{% if version == '2' %}
|
||||
{{ _('Enter your email to begin.') }}
|
||||
{% elif version == '3' %}
|
||||
{{ _('Create a Firefox account to begin.') }}
|
||||
{% endif %}
|
||||
</label>
|
||||
<input type="email" id="fxa-email" class="fxa-email" placeholder="{{ _('YOUR EMAIL HERE') }}">
|
||||
<button type="submit" class="button" data-button-name="Get started with Sync" data-cta-position="Primary" id="cta-sync-variation">
|
||||
{% if version == '2' %}
|
||||
{{ _('Get started with Sync') }}
|
||||
{% elif version == '3' %}
|
||||
{{ _('Set up Sync') }}
|
||||
{% endif %}
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="show-fx-29-30">
|
||||
<a href="https://support.mozilla.org/kb/update-firefox-latest-version" class="button" data-interaction="button click" data-element-action="Sync CTA" id="cta-update">
|
||||
{{ _('Update your Firefox') }}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="show-not-fx show-fx-28-older">
|
||||
{{ download_firefox() }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# Instructions #}
|
||||
|
||||
<div class="show-fx-29-30 show-default instructions">
|
||||
<h3>{{ _('Get started with Sync in four easy steps:') }}</h3>
|
||||
<section>
|
||||
<ol>
|
||||
<li>{% trans url='https://support.mozilla.org/kb/learn-more-about-the-design-of-new-firefox' %}
|
||||
Open the <a class="menu ga-link" data-interaction="outbound link click" href="{{ url }}#w_a-handy-new-menu">menu</a> in the top right of Firefox and select “<strong>Sign in to Sync.</strong>”
|
||||
{% endtrans %}</li>
|
||||
{# L10n: <strong> tags below used for font color formatting. #}
|
||||
<li>{{ _('Click “<strong>Get started</strong>” in the tab that opens.') }}</li>
|
||||
<li>{{ _('Enter an email address and password to “<strong>Create a Firefox Account.</strong>”') }}</li>
|
||||
<li>{{ _('Click “<strong>Next</strong>” to get a verification sent to your email.') }}</li>
|
||||
</ol>
|
||||
<p>{{ _('After you check your email and click the verification link, you’ll be all set! Firefox will automatically sync in the background from then on.') }}</p>
|
||||
</section>
|
||||
<aside role="complimentary">
|
||||
<ul class="unstyled">
|
||||
<li><a class="more ga-link" data-interaction="outbound link click" href="https://support.mozilla.org/kb/how-do-i-set-up-firefox-sync">{{ _('Get more detailed instructions.') }}</a></li>
|
||||
<li><a class="more ga-link" data-interaction="outbound link click" href="https://support.mozilla.org/kb/how-to-update-to-the-new-firefox-sync">{{ _('Using an older version of Sync?') }}</a></li>
|
||||
</ul>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
<div class="show-fx-28-older instructions">
|
||||
<ul class="unstyled">
|
||||
<li><a class="more ga-link" data-interaction="outbound link click" href="https://support.mozilla.org/kb/how-do-i-set-up-firefox-sync">{{ _('Get more detailed instructions.') }}</a></li>
|
||||
<li><a class="more ga-link" data-interaction="outbound link click" href="https://support.mozilla.org/kb/how-to-update-to-the-new-firefox-sync">{{ _('Using an older version of Sync?') }}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="show-fx-android instructions">
|
||||
<h3>{{ _('How to set up Sync in five easy steps:') }}</h3>
|
||||
<section>
|
||||
<ol>
|
||||
{# L10n: <strong> tags below used for font color formatting. #}
|
||||
<li>{{ _('Tap the <strong>Menu</strong> button (either below the screen or at the top right corner of the browser).') }}</li>
|
||||
<li>{{ _('Select <strong>Settings</strong> (you may need to tap <strong>More</strong> first).') }}</li>
|
||||
<li>{{ _('Tap <strong>Sync</strong> and then <strong>Get Started</strong>.') }}</li>
|
||||
<li>{{ _('The <strong>Create a Firefox Account page</strong> will open in a new tab.') }}</li>
|
||||
<li>{{ _('Fill out the form and click <strong>Next</strong>.') }}</li>
|
||||
</ol>
|
||||
<p>{{ _('After you check your email and click the verification link, you’ll be ready to go! Don’t forget to connect all your other devices to get the most of Sync.') }}</p>
|
||||
</section>
|
||||
<aside role="complimentary">
|
||||
<ul class="unstyled">
|
||||
<li><a class="more ga-link" data-interaction="outbound link click" href="https://support.mozilla.org/kb/how-do-i-set-up-firefox-sync">{{ _('Get more detailed instructions.') }}</a></li>
|
||||
<li><a class="more ga-link" data-interaction="outbound link click" href="https://support.mozilla.org/kb/how-to-update-to-the-new-firefox-sync">{{ _('Using an older version of Sync?') }}</a></li>
|
||||
</ul>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="secondary">
|
||||
<div class="inner-wrapper">
|
||||
<div class="container">
|
||||
{% block features %}
|
||||
<header>
|
||||
<h2>{{ _('Sync a little. Sync a lot.') }}</h2>
|
||||
<p>
|
||||
{{ _('You choose what parts of your Firefox you want to sync and where you want to sync them. Take your open tabs on your daily commute. Access your bookmarks at work. Whatever, whenever, everywhere.') }}
|
||||
</p>
|
||||
</header>
|
||||
<div class="features">
|
||||
<div class="feature-home">
|
||||
<h3>{{ _('At home') }}</h3>
|
||||
<p>
|
||||
{% if LANG.startswith('en-') %}
|
||||
{{ _('Move from your desk to the couch without skipping a beat. Access your open tabs on your smartphone, or keep browsing your bookmarks right on your tablet.') }}
|
||||
{% else %}
|
||||
{{ _('Move from your desk to the couch without skipping a beat. Access your open tabs on your smartphone, or keeping browsing your bookmarks right on your tablet.') }}
|
||||
{% endif %}
|
||||
</p>
|
||||
</div>
|
||||
<div class="feature-work">
|
||||
<h3>{{ _('At work') }}</h3>
|
||||
<p>
|
||||
{{ _('Stay connected to all of your important information. Sync the passwords and bookmarks that you might need to access at any time. Just like Firefox, it’s safe as can be.') }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="feature-go">
|
||||
<h3>{{ _('On the go') }}</h3>
|
||||
<p>
|
||||
{{ _('Keep up with your favorite sites, or finish that story you started at home — wherever you go. With Sync, it’s never been easier.') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="cta">
|
||||
<div class="inner-wrapper">
|
||||
<div class="container">
|
||||
<header>
|
||||
<h3>{{ _('Get Firefox everywhere') }}</h3>
|
||||
{{ google_play_button(id='cta-android-footer') }}
|
||||
<a href="{{ firefox_ios_url('mozorg-sync_page-appstore-button-footer') }}" data-link-type="download" data-download-os="iOS" id="cta-ios-footer">
|
||||
<img src="{{ l10n_img('firefox/ios/btn-app-store.svg') }}" alt="{{ _('Download on the App Store') }}" width="152" height="45">
|
||||
</a>
|
||||
</header>
|
||||
<aside>
|
||||
<p>
|
||||
{% block everywhere_copy %}
|
||||
{{ _('To get the full Sync experience, take your Web with you everywhere you use Firefox. Connect your smartphone, tablet, computer and laptop.') }}
|
||||
{% endblock %}
|
||||
</p>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block email_form %}
|
||||
<aside id="newsletter-subscribe" class="light ga-section" data-ga-label="Keep up with all things Firefox.">
|
||||
<div class="inner-wrapper container">
|
||||
{# L10n: Line break for visual formatting. #}
|
||||
{{ email_newsletter_form(title=_('Keep up with<br> all things Firefox.'), button_class='button-dark') }}
|
||||
</div>
|
||||
</aside>
|
||||
{% endblock %}
|
||||
|
||||
{% block js %}
|
||||
<!--[if IE 9]>
|
||||
{% javascript 'matchmedia_addlistener' %}
|
||||
<![endif]-->
|
||||
{% javascript 'firefox_sync' %}
|
||||
{% endblock %}
|
||||
|
|
@ -691,19 +691,19 @@ class TestFirefoxProductIOSView(TestCase):
|
|||
@patch('bedrock.firefox.views.l10n_utils.render')
|
||||
class TestSync(TestCase):
|
||||
def test_en_us_template(self, render_mock):
|
||||
req = RequestFactory().get('/firefox/sync/')
|
||||
req = RequestFactory().get('/firefox/features/sync/')
|
||||
req.locale = 'en-US'
|
||||
views.sync(req)
|
||||
render_mock.assert_called_once_with(req, 'firefox/sync-en.html')
|
||||
views.FeaturesSyncView(req)
|
||||
render_mock.assert_called_once_with(req, 'firefox/features/sync-en.html')
|
||||
|
||||
def test_en_gb_template(self, render_mock):
|
||||
req = RequestFactory().get('/firefox/sync/')
|
||||
req = RequestFactory().get('/firefox/features/sync/')
|
||||
req.locale = 'en-GB'
|
||||
views.sync(req)
|
||||
render_mock.assert_called_once_with(req, 'firefox/sync-en.html')
|
||||
views.FeaturesSyncView(req)
|
||||
render_mock.assert_called_once_with(req, 'firefox/features/sync-en.html')
|
||||
|
||||
def test_locales_template(self, render_mock):
|
||||
req = RequestFactory().get('/firefox/sync/')
|
||||
req = RequestFactory().get('/firefox/features/sync/')
|
||||
req.locale = 'de'
|
||||
views.sync(req)
|
||||
render_mock.assert_called_once_with(req, 'firefox/sync.html')
|
||||
views.FeaturesSyncView(req)
|
||||
render_mock.assert_called_once_with(req, 'firefox/features/sync.html')
|
||||
|
|
|
|||
|
|
@ -64,6 +64,9 @@ urlpatterns = (
|
|||
url('^firefox/features/password-manager/$',
|
||||
views.FeaturesPasswordManagerView.as_view(),
|
||||
name='firefox.features.password-manager'),
|
||||
url('^firefox/features/sync/$',
|
||||
views.FeaturesSyncView,
|
||||
name='firefox.features.sync'),
|
||||
url(r'^firefox/focus/$',
|
||||
views.FirefoxFocusView.as_view(),
|
||||
name='firefox.focus'),
|
||||
|
|
@ -87,7 +90,6 @@ urlpatterns = (
|
|||
}),
|
||||
url('^firefox/send-to-device-post/$', views.send_to_device_ajax,
|
||||
name='firefox.send-to-device-post'),
|
||||
url(r'^firefox/sync/$', views.sync, name='firefox.sync'),
|
||||
page('firefox/unsupported-systems', 'firefox/unsupported-systems.html'),
|
||||
url(r'^firefox/new/$', views.new, name='firefox.new'),
|
||||
page('firefox/organizations/faq', 'firefox/organizations/faq.html'),
|
||||
|
|
|
|||
|
|
@ -651,6 +651,17 @@ class FeaturesPasswordManagerView(BlogPostsView):
|
|||
blog_tags = ['modern', 'private', 'featured']
|
||||
|
||||
|
||||
def FeaturesSyncView(request):
|
||||
locale = l10n_utils.get_locale(request)
|
||||
|
||||
if locale.startswith('en-'):
|
||||
template = 'firefox/features/sync-en.html'
|
||||
else:
|
||||
template = 'firefox/features/sync.html'
|
||||
|
||||
return l10n_utils.render(request, template)
|
||||
|
||||
|
||||
class FirefoxProductDesktopView(BlogPostsView):
|
||||
blog_posts_limit = 3
|
||||
blog_posts_template_variable = 'articles'
|
||||
|
|
@ -727,17 +738,6 @@ class FirefoxHubView(BlogPostsView):
|
|||
return HttpResponseRedirect(reverse('firefox.new'))
|
||||
|
||||
|
||||
def sync(request):
|
||||
locale = l10n_utils.get_locale(request)
|
||||
|
||||
if locale.startswith('en-'):
|
||||
template = 'firefox/sync-en.html'
|
||||
else:
|
||||
template = 'firefox/sync.html'
|
||||
|
||||
return l10n_utils.render(request, template)
|
||||
|
||||
|
||||
def FirefoxProductDevEditionView(request, template='firefox/products/developer.html'):
|
||||
locale = l10n_utils.get_locale(request)
|
||||
|
||||
|
|
|
|||
|
|
@ -357,6 +357,12 @@ PIPELINE_CSS = {
|
|||
),
|
||||
'output_filename': 'css/firefox-features-hub-detail-bundle.css',
|
||||
},
|
||||
'firefox-features-sync': {
|
||||
'source_filenames': (
|
||||
'css/firefox/features/sync.scss',
|
||||
),
|
||||
'output_filename': 'css/firefox-features-sync-bundle.css',
|
||||
},
|
||||
'firefox-interest-dashboard': {
|
||||
'source_filenames': (
|
||||
'css/firefox/family-nav.less',
|
||||
|
|
@ -720,14 +726,6 @@ PIPELINE_CSS = {
|
|||
),
|
||||
'output_filename': 'css/firefox_releasenotes-bundle.css',
|
||||
},
|
||||
'firefox_sync': {
|
||||
'source_filenames': (
|
||||
'css/firefox/family-nav.less',
|
||||
'css/newsletter/fxnewsletter-subscribe.less',
|
||||
'css/firefox/sync.less',
|
||||
),
|
||||
'output_filename': 'css/firefox_sync-bundle.css',
|
||||
},
|
||||
'firefox_sync_anim': {
|
||||
'source_filenames': (
|
||||
'css/firefox/sync-animation.less',
|
||||
|
|
@ -1361,6 +1359,13 @@ PIPELINE_JS = {
|
|||
),
|
||||
'output_filename': 'js/firefox-features-landing-bundle.js',
|
||||
},
|
||||
'firefox-features-sync': {
|
||||
'source_filenames': (
|
||||
'js/base/uitour-lib.js',
|
||||
'js/firefox/features-sync.js',
|
||||
),
|
||||
'output_filename': 'js/firefox-features-sync-bundle.js',
|
||||
},
|
||||
'firefox_fx38_0_5_firstrun': {
|
||||
'source_filenames': (
|
||||
'js/base/uitour-lib.js',
|
||||
|
|
@ -1512,18 +1517,6 @@ PIPELINE_JS = {
|
|||
),
|
||||
'output_filename': 'js/firefox_faq-bundle.js',
|
||||
},
|
||||
'firefox_sync': {
|
||||
'source_filenames': (
|
||||
'js/base/search-params.js',
|
||||
'js/libs/jquery.waypoints.min.js',
|
||||
'js/libs/jquery.waypoints-sticky.min.js',
|
||||
'js/firefox/family-nav.js',
|
||||
'js/firefox/sync-animation.js',
|
||||
'js/base/uitour-lib.js',
|
||||
'js/firefox/sync.js',
|
||||
),
|
||||
'output_filename': 'js/firefox_sync-bundle.js',
|
||||
},
|
||||
'firefox_feedback': {
|
||||
'source_filenames': (
|
||||
'js/base/mozilla-share-cta.js',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,104 @@
|
|||
// 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/.
|
||||
|
||||
@import '../../pebbles/includes/lib';
|
||||
|
||||
|
||||
.header-intro .header-download {
|
||||
@media #{$mq-tablet} {
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.primary-buttons {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.warning span {
|
||||
background: #fb8e92;
|
||||
}
|
||||
|
||||
@media #{$mq-tablet} {
|
||||
#sync-intro-copy-cta-wrapper {
|
||||
@include clearfix();
|
||||
}
|
||||
|
||||
#sync-intro-copy {
|
||||
@include span(6);
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
#sync-intro-cta {
|
||||
@include span(6);
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media #{$mq-desktop} {
|
||||
#sync-intro-copy {
|
||||
@include span(8);
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
#sync-intro-cta {
|
||||
@include span(4);
|
||||
}
|
||||
}
|
||||
|
||||
@media #{$mq-desktop-wide} {
|
||||
#sync-intro-copy {
|
||||
@include span(9);
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
#sync-intro-cta {
|
||||
@include span(3);
|
||||
}
|
||||
}
|
||||
|
||||
// no CTA for android
|
||||
.state-fx-android {
|
||||
#sync-intro-copy,
|
||||
#sync-intro-cta {
|
||||
@include span-all();
|
||||
}
|
||||
}
|
||||
|
||||
#sync-intro-instructions ol {
|
||||
list-style-type: numeric;
|
||||
margin: 20px 0 20px 20px;
|
||||
}
|
||||
|
||||
// Hide elements marked for specific variations by default
|
||||
.show-fx-31-signed-in,
|
||||
.show-fx-31-signed-out,
|
||||
.show-fx-30-older,
|
||||
.show-fx-android,
|
||||
.show-ios,
|
||||
.show-not-fx,
|
||||
.show-default {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Show elements for current variation
|
||||
.state-fx-31-signed-in .show-fx-31-signed-in,
|
||||
.state-fx-31-signed-out .show-fx-31-signed-out,
|
||||
.state-fx-30-older .show-fx-30-older,
|
||||
.state-fx-android .show-fx-android,
|
||||
.state-not-fx .show-not-fx,
|
||||
.state-default .show-default {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.state-fx-android {
|
||||
.cta {
|
||||
h3,
|
||||
.android-button {
|
||||
display: none;
|
||||
}
|
||||
.container {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,643 +0,0 @@
|
|||
// 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/.
|
||||
|
||||
@import "../sandstone/lib.less";
|
||||
|
||||
@syncBlue: #0092db;
|
||||
@syncGreen: #14c329;
|
||||
|
||||
#wrapper:before {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
right: 85px;
|
||||
height: 250px;
|
||||
width: 250px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
width: 100%;
|
||||
padding-bottom: 0;
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
#masthead {
|
||||
width: @widthDesktop - (@gridGutterWidth * 2);
|
||||
}
|
||||
|
||||
.inner-wrapper {
|
||||
padding: (@baseLine * 2) 0;
|
||||
width: @widthDesktop;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.button-footer {
|
||||
margin: @baseLine 0 0 0;
|
||||
text-align: center;
|
||||
a {
|
||||
.trailing-arrow();
|
||||
}
|
||||
}
|
||||
|
||||
.buttons {
|
||||
text-align: center;
|
||||
|
||||
.download-button,
|
||||
.button {
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.state-fx-android .primary .inner-wrapper {
|
||||
padding-top: @baseLine;
|
||||
}
|
||||
|
||||
.primary {
|
||||
.inner-wrapper {
|
||||
padding-bottom: @baseLine * 2;
|
||||
}
|
||||
.buttons {
|
||||
.span(10);
|
||||
.offset(1);
|
||||
float: none;
|
||||
clear: both;
|
||||
|
||||
> div {
|
||||
padding: 0 (@baseLine * 5) @baseLine;
|
||||
}
|
||||
|
||||
> div.show-fx-31-signed-in,
|
||||
> div.show-fx-31-signed-out {
|
||||
padding: 0 @baseLine @baseLine;
|
||||
}
|
||||
|
||||
> .show-fx-31-signed-in p {
|
||||
.font-size(18px);
|
||||
.open-sans-light();
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.warning {
|
||||
.span(8);
|
||||
.offset(2);
|
||||
clear: both;
|
||||
text-align: center;
|
||||
margin-bottom: @baseLine;
|
||||
p {
|
||||
display: inline-block;
|
||||
.font-size(18px);
|
||||
padding: 0 35px;
|
||||
position: relative;
|
||||
&:before {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: 0;
|
||||
content: " ";
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
.at2x('/media/img/firefox/sync/icons.png', 234px, 70px);
|
||||
background-position: -210px 0;
|
||||
}
|
||||
|
||||
.ios & {
|
||||
padding: 0; /* remove padding to prevent single word from wrapping */
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.primary-buttons {
|
||||
.flexbox();
|
||||
.justify-content(center);
|
||||
list-style-type: none;
|
||||
|
||||
& > li {
|
||||
margin: 0;
|
||||
padding: 0 @baseLine;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
#fxa-email-form {
|
||||
.flexbox();
|
||||
.justify-content(center);
|
||||
.flex-wrap(wrap);
|
||||
|
||||
label {
|
||||
display: block;
|
||||
flex-basis: 100%;
|
||||
margin-bottom: @baseLine;
|
||||
text-align: center;
|
||||
.font-size(18px);
|
||||
.open-sans-light();
|
||||
}
|
||||
|
||||
.fxa-email {
|
||||
display: none;
|
||||
|
||||
&.active {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
button,
|
||||
input {
|
||||
.flex(1);
|
||||
margin: 0 (@baseLine / 2);
|
||||
}
|
||||
|
||||
input {
|
||||
.border-box();
|
||||
padding: 15px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.state-not-fx .primary .warning p:before {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.secondary {
|
||||
background: #fff;
|
||||
header {
|
||||
.span(8);
|
||||
.offset(2);
|
||||
text-align: center;
|
||||
margin-bottom: @baseLine * 2;
|
||||
h2 {
|
||||
.font-size(48px);
|
||||
}
|
||||
p {
|
||||
.open-sans-light();
|
||||
.font-size(18px);
|
||||
}
|
||||
}
|
||||
.inner-wrapper {
|
||||
padding: 50px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.cta {
|
||||
background: @syncBlue;
|
||||
color: #fff;
|
||||
.inner-wrapper {
|
||||
.at2x('/media/img/firefox/sync/device-lineup.png', 240px, 123px);
|
||||
background-position: 0 43px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
header {
|
||||
text-align: center;
|
||||
float: left;
|
||||
width: 360px;
|
||||
margin-left: 230px;
|
||||
|
||||
h3 {
|
||||
margin: (@baseLine / 2) 0 @baseLine;
|
||||
}
|
||||
|
||||
a:last-child {
|
||||
margin-left: @baseLine / 2;
|
||||
}
|
||||
}
|
||||
aside {
|
||||
float: left;
|
||||
width: 300px;
|
||||
margin-left: 70px;
|
||||
|
||||
p {
|
||||
font-style: italic;
|
||||
border-left: 1px solid rgba(198,218,229,.8);
|
||||
padding-left: @baseLine;
|
||||
.open-sans-light();
|
||||
.font-size(20px);
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
h3 {
|
||||
color: #fff;
|
||||
.font-size(32px);
|
||||
letter-spacing: -0.02em;
|
||||
b {
|
||||
.open-sans();
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
&,
|
||||
h3 {
|
||||
text-shadow: 0 1px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.features {
|
||||
> div {
|
||||
.span(4);
|
||||
text-align: center;
|
||||
&:before {
|
||||
display: inline-block;
|
||||
content: " ";
|
||||
height: 70px;
|
||||
width: 70px;
|
||||
margin: 0 auto 10px;
|
||||
border: 2px solid @syncBlue;
|
||||
border-radius: 50%;
|
||||
.at2x('/media/img/firefox/sync/icons.png', 234px, 70px);
|
||||
background-position: 0 0;
|
||||
}
|
||||
&.feature-work:before { background-position: -70px 0; }
|
||||
&.feature-go:before { background-position: -140px 0; }
|
||||
}
|
||||
h3 {
|
||||
.font-size(24px);
|
||||
}
|
||||
}
|
||||
|
||||
.instructions {
|
||||
clear: both;
|
||||
.clearfix();
|
||||
float: left;
|
||||
width: 100%;
|
||||
margin-top: @baseLine;
|
||||
padding-top: @baseLine * 2;
|
||||
text-align: left;
|
||||
// Source image: /media/img/firefox/sync/stripes.png
|
||||
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAwgAAAAFCAQAAABLegPfAAAALUlEQVR4Ae3VIREAAAgEwUtD/4goSLFm5/Sbr6lIkvwgSboDkiQvSJIsI5AkF0T5v+/j2Q2AAAAAAElFTkSuQmCC');
|
||||
background-position: 0 0;
|
||||
background-repeat: repeat-x;
|
||||
section {
|
||||
.span(7);
|
||||
.offset(1);
|
||||
}
|
||||
h3 {
|
||||
.offset(1);
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
li {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
aside {
|
||||
.span(4);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
a.menu:before {
|
||||
content:'\2630 ';
|
||||
}
|
||||
|
||||
a.menurev:after {
|
||||
content:' \2630';
|
||||
}
|
||||
|
||||
&.show-fx-28-older {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
// Hide elements marked for specific variations by default
|
||||
.show-fx-31-signed-in,
|
||||
.show-fx-31-signed-out,
|
||||
.show-fx-29-30,
|
||||
.show-fx-28-older,
|
||||
.show-fx-android,
|
||||
.show-ios,
|
||||
.show-not-fx,
|
||||
.show-default {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Show elements for current variation
|
||||
.state-fx-31-signed-in .show-fx-31-signed-in,
|
||||
.state-fx-31-signed-out .show-fx-31-signed-out,
|
||||
.state-fx-29-30 .show-fx-29-30,
|
||||
.state-fx-28-older .show-fx-28-older,
|
||||
.state-fx-android .show-fx-android,
|
||||
.state-not-fx .show-not-fx,
|
||||
.state-default .show-default {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.js .show-not-fx .download-button ul {
|
||||
width: 250px;
|
||||
margin: 0 auto 10px;
|
||||
}
|
||||
|
||||
.state-fx-android {
|
||||
.cta {
|
||||
h3,
|
||||
.android-button {
|
||||
display: none;
|
||||
}
|
||||
.container {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.intro {
|
||||
width: @widthDesktop - (@gridGutterWidth * 4);
|
||||
margin: @baseLine auto 0;
|
||||
text-align: center;
|
||||
h1 {
|
||||
.font-size(64px);
|
||||
line-height: 1.2;
|
||||
}
|
||||
p {
|
||||
.open-sans-light;
|
||||
.font-size(28px);
|
||||
line-height: 1.4;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.sync-anim {
|
||||
position: relative;
|
||||
height: 190px;
|
||||
width: 390px;
|
||||
margin: @baseLine auto;
|
||||
background-image: url('/media/img/firefox/sync/composite.png');
|
||||
}
|
||||
|
||||
.android-link {
|
||||
.trailing-arrow();
|
||||
}
|
||||
|
||||
/* RTL support */
|
||||
html[dir="rtl"] {
|
||||
#wrapper:before {
|
||||
left: 85px;
|
||||
right: auto;
|
||||
}
|
||||
.instructions {
|
||||
text-align: right;
|
||||
section {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablet Layout: 760px */
|
||||
@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
|
||||
|
||||
#wrapper:before {
|
||||
top: 120px;
|
||||
right: 20px;
|
||||
height: 175px;
|
||||
width: 175px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
#masthead {
|
||||
width: @widthTablet - (@gridGutterWidth * 2);
|
||||
}
|
||||
|
||||
.inner-wrapper {
|
||||
width: @widthTablet;
|
||||
}
|
||||
|
||||
.intro {
|
||||
width: @widthTablet - (@gridGutterWidth * 4);
|
||||
h1 {
|
||||
.font-size(42px);
|
||||
}
|
||||
p {
|
||||
.font-size(18px);
|
||||
margin-left: 40px;
|
||||
margin-right: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.primary {
|
||||
.warning {
|
||||
.span_narrow(8);
|
||||
.offset_narrow(2);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
margin-left: 50px;
|
||||
.span(9);
|
||||
}
|
||||
}
|
||||
|
||||
.secondary {
|
||||
header {
|
||||
.span_narrow(10);
|
||||
.offset_narrow(1);
|
||||
margin-bottom: @baseLine;
|
||||
h2 {
|
||||
.font-size(36px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.features {
|
||||
> div {
|
||||
.span_narrow(4);
|
||||
}
|
||||
}
|
||||
|
||||
.instructions {
|
||||
section {
|
||||
.span_narrow(8);
|
||||
}
|
||||
h3 {
|
||||
.span-all();
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
aside {
|
||||
.span_narrow(4);
|
||||
}
|
||||
}
|
||||
|
||||
.cta {
|
||||
.inner-wrapper {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
header {
|
||||
.span_narrow(8);
|
||||
.offset_narrow(2);
|
||||
margin-left: @baseLine / 2;
|
||||
|
||||
h3 {
|
||||
padding: 0 (@baseLine * 2);
|
||||
}
|
||||
}
|
||||
|
||||
aside {
|
||||
.span_narrow(4);
|
||||
p {
|
||||
.font-size(@largeFontSize);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* Mobile layout: 480px */
|
||||
@media only screen and (max-width: @breakTablet) {
|
||||
|
||||
#wrapper:before {
|
||||
content: "";
|
||||
background: none;
|
||||
}
|
||||
|
||||
#masthead {
|
||||
width: @widthMobileLandscape - (@gridGutterWidth);
|
||||
}
|
||||
|
||||
.inner-wrapper {
|
||||
width: @widthMobileLandscape;
|
||||
}
|
||||
|
||||
.intro {
|
||||
width: @widthMobileLandscape - (@gridGutterWidth * 2);
|
||||
padding-bottom: 0;
|
||||
h1 {
|
||||
.font-size(36px);
|
||||
}
|
||||
p {
|
||||
.font-size(@largeFontSize);
|
||||
}
|
||||
}
|
||||
|
||||
.sync-anim {
|
||||
float: none;
|
||||
margin: 0 auto @baseLine auto;
|
||||
}
|
||||
|
||||
.primary {
|
||||
.warning,
|
||||
.buttons {
|
||||
.span-all();
|
||||
|
||||
> div {
|
||||
padding-left: @baseLine;
|
||||
padding-right: @baseLine;
|
||||
}
|
||||
}
|
||||
.warning p {
|
||||
.font-size(@largeFontSize);
|
||||
line-height: 1.4;
|
||||
}
|
||||
.container {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.primary-buttons {
|
||||
display: block;
|
||||
|
||||
li {
|
||||
margin-bottom: @baseLine;
|
||||
}
|
||||
}
|
||||
|
||||
#fxa-email-form {
|
||||
display: block;
|
||||
|
||||
button,
|
||||
input {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
input {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin-bottom: @baseLine;
|
||||
}
|
||||
}
|
||||
|
||||
.secondary {
|
||||
header {
|
||||
.span-all();
|
||||
margin-bottom: @baseLine;
|
||||
h2 {
|
||||
.font-size(24px);
|
||||
}
|
||||
p {
|
||||
.font-size(@largeFontSize);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.features {
|
||||
> div {
|
||||
.span-all();
|
||||
}
|
||||
h3 {
|
||||
.font-size(20px);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.instructions {
|
||||
section,
|
||||
aside,
|
||||
h3 {
|
||||
.span-all();
|
||||
}
|
||||
h3 {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.cta {
|
||||
.inner-wrapper {
|
||||
background-position: center (@baseLine * 2);
|
||||
}
|
||||
header {
|
||||
float: none;
|
||||
width: auto;
|
||||
margin: 0 0 @baseLine;
|
||||
padding-top: 150px;
|
||||
|
||||
h3 {
|
||||
.font-size(24px);
|
||||
}
|
||||
}
|
||||
aside {
|
||||
.span-all();
|
||||
text-align: center;
|
||||
p {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
.font-size(18px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* Mobile layout: 320px */
|
||||
@media only screen and (max-width: @breakMobileLandscape) {
|
||||
|
||||
.sync-anim {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.primary .buttons {
|
||||
margin: 0;
|
||||
|
||||
> div {
|
||||
padding: 0 0 20px 0;
|
||||
}
|
||||
}
|
||||
|
||||
#masthead {
|
||||
width: @widthMobile - (@gridGutterWidth);
|
||||
}
|
||||
|
||||
.inner-wrapper {
|
||||
width: @widthMobile;
|
||||
}
|
||||
|
||||
.intro {
|
||||
width: @widthMobile - (@gridGutterWidth * 2);
|
||||
}
|
||||
|
||||
}
|
||||
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 69 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 22 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 70 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 67 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 72 KiB |
Двоичные данные
media/img/firefox/sync/device-laptop.png
Двоичные данные
media/img/firefox/sync/device-laptop.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 4.6 KiB |
Двоичные данные
media/img/firefox/sync/device-lineup-high-res.png
Двоичные данные
media/img/firefox/sync/device-lineup-high-res.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 26 KiB |
Двоичные данные
media/img/firefox/sync/device-lineup.png
Двоичные данные
media/img/firefox/sync/device-lineup.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 9.7 KiB |
Двоичные данные
media/img/firefox/sync/device-phone.png
Двоичные данные
media/img/firefox/sync/device-phone.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 4.5 KiB |
Двоичные данные
media/img/firefox/sync/device-tablet.png
Двоичные данные
media/img/firefox/sync/device-tablet.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 3.0 KiB |
Двоичные данные
media/img/firefox/sync/firefox-logo.png
Двоичные данные
media/img/firefox/sync/firefox-logo.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 14 KiB |
Двоичные данные
media/img/firefox/sync/icon-bookmarks.png
Двоичные данные
media/img/firefox/sync/icon-bookmarks.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 1.7 KiB |
Двоичные данные
media/img/firefox/sync/icon-history.png
Двоичные данные
media/img/firefox/sync/icon-history.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 2.3 KiB |
Двоичные данные
media/img/firefox/sync/icon-passwords.png
Двоичные данные
media/img/firefox/sync/icon-passwords.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 1.3 KiB |
Двоичные данные
media/img/firefox/sync/icons-high-res.png
Двоичные данные
media/img/firefox/sync/icons-high-res.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 3.5 KiB |
Двоичные данные
media/img/firefox/sync/icons.png
Двоичные данные
media/img/firefox/sync/icons.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 2.2 KiB |
Двоичные данные
media/img/firefox/sync/stripes.png
Двоичные данные
media/img/firefox/sync/stripes.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 102 B |
Двоичные данные
media/img/firefox/sync/sync-arrows.png
Двоичные данные
media/img/firefox/sync/sync-arrows.png
Двоичный файл не отображается.
|
До Ширина: | Высота: | Размер: 10 KiB |
|
|
@ -7,15 +7,12 @@
|
|||
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
|
||||
setTimeout(Mozilla.syncAnimation, 1000);
|
||||
|
||||
/* This shows six different content variations, depending on the browser/state
|
||||
/* This shows five different content variations, depending on the browser/state
|
||||
* 1. Firefox 31+ (signed-in to Sync) <-- default
|
||||
* 2. Firefox 31+ (signed-out of Sync)
|
||||
* 3. Firefox 29 or 30
|
||||
* 4. Firefox 28 or older
|
||||
* 5. Firefox for Android
|
||||
* 6. Not Firefox (any other browser)
|
||||
* 3. Firefox 30 or older
|
||||
* 4. Firefox for Android
|
||||
* 5. Not Firefox (any other browser)
|
||||
*/
|
||||
|
||||
// Variation #1: Firefox 31+ signed-in to Sync
|
||||
|
|
@ -27,30 +24,21 @@
|
|||
var state = 'Unknown';
|
||||
var syncCapable = false;
|
||||
var body = $('body');
|
||||
var $fxaEmailForm = $('#fxa-email-form');
|
||||
var $fxaEmailElements = $('.fxa-email');
|
||||
var $fxaEmailField = $('#fxa-email');
|
||||
var fxaEmail;
|
||||
var hasSessionStorage = false;
|
||||
|
||||
var swapState = function(stateClass) {
|
||||
body.removeClass('state-default');
|
||||
body.addClass(stateClass);
|
||||
|
||||
if (stateClass === 'state-fx-31-signed-out') {
|
||||
initVariationsForm();
|
||||
}
|
||||
};
|
||||
|
||||
// Variations 1-5 are Firefox
|
||||
// Variations 1-4 are Firefox
|
||||
if (client.isFirefox) {
|
||||
// Variation #5: Firefox for Android
|
||||
if (client.isFirefoxAndroid) {
|
||||
|
||||
// Variation #4: Firefox for Android
|
||||
if (client.isFirefoxAndroid) {
|
||||
swapState('state-fx-android');
|
||||
state = 'Firefox for Android';
|
||||
|
||||
// Variation #1-4: Firefox for Desktop
|
||||
// Variation #1-3: Firefox for Desktop
|
||||
} else if (client.isFirefoxDesktop) {
|
||||
|
||||
if (fxMasterVersion >= 31) {
|
||||
|
|
@ -81,20 +69,13 @@
|
|||
});
|
||||
});
|
||||
|
||||
// Variation #3: Firefox 29 or 30
|
||||
} else if (fxMasterVersion === 29 || fxMasterVersion === 30) {
|
||||
swapState('state-fx-29-30');
|
||||
state = 'Firefox 29 or 30';
|
||||
|
||||
// Variation #4: Firefox 28 or older
|
||||
} else if (fxMasterVersion <= 28) {
|
||||
swapState('state-fx-28-older');
|
||||
state = 'Firefox 28 or Older';
|
||||
// Variation #3: Firefox 30 or older
|
||||
} else if (fxMasterVersion <= 30) {
|
||||
swapState('state-fx-30-older');
|
||||
state = 'Firefox 30 or older';
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Variation #6: Not Firefox
|
||||
// Variation #5: Not Firefox
|
||||
} else {
|
||||
swapState('state-not-fx');
|
||||
state = 'Not Firefox';
|
||||
|
|
@ -120,47 +101,4 @@
|
|||
|
||||
Mozilla.UITour.showFirefoxAccounts(params.utmParamsFxA());
|
||||
});
|
||||
|
||||
// v2/3 variations only for Fx 31+ signed out of sync
|
||||
function initVariationsForm() {
|
||||
// only show email field if sessionStorage is available
|
||||
try {
|
||||
window.sessionStorage.setItem('moz-session-storage-check', true);
|
||||
window.sessionStorage.removeItem('moz-session-storage-check');
|
||||
|
||||
$fxaEmailElements.addClass('active');
|
||||
$fxaEmailField.attr('required', 'required');
|
||||
|
||||
hasSessionStorage = true;
|
||||
} catch(ex) {
|
||||
// empty block
|
||||
}
|
||||
|
||||
$fxaEmailForm.on('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
$fxaEmailForm.off('submit');
|
||||
|
||||
window.dataLayer.push({
|
||||
'event': 'sync-interactions',
|
||||
'interaction': 'form submit',
|
||||
'form-name': $.trim($('#cta-sync-variation').text()),
|
||||
'test-variation': $('#variation').val()
|
||||
});
|
||||
|
||||
// store email in sessionStorage and clear the field
|
||||
if (hasSessionStorage) {
|
||||
fxaEmail = $fxaEmailField.val();
|
||||
|
||||
// basic email validation
|
||||
if (/(.+)@(.+)\.(.+){2,}/.test(fxaEmail)) {
|
||||
window.sessionStorage.setItem('fxa-email', $fxaEmailField.val());
|
||||
}
|
||||
|
||||
$fxaEmailField.removeAttr('required').val('');
|
||||
}
|
||||
|
||||
$fxaEmailForm.submit();
|
||||
});
|
||||
}
|
||||
})(window.jQuery, window.Mozilla);
|
||||
|
|
@ -14,7 +14,8 @@ from pages.firefox.features.feature import FeaturePage
|
|||
('fast'),
|
||||
('memory'),
|
||||
('bookmarks'),
|
||||
('password-manager')])
|
||||
('password-manager'),
|
||||
('sync')])
|
||||
def test_download_button_is_displayed(slug, base_url, selenium):
|
||||
page = FeaturePage(selenium, base_url, slug=slug).open()
|
||||
assert page.download_button.is_displayed
|
||||
|
|
|
|||
|
|
@ -1,22 +0,0 @@
|
|||
# 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/.
|
||||
|
||||
import pytest
|
||||
|
||||
from pages.firefox.sync import FirefoxSyncPage
|
||||
|
||||
|
||||
@pytest.mark.skip_if_firefox(reason='Download button is not shown for Firefox browsers.')
|
||||
@pytest.mark.nondestructive
|
||||
def test_download_button_is_displayed(base_url, selenium):
|
||||
page = FirefoxSyncPage(selenium, base_url).open()
|
||||
assert page.download_button.is_displayed
|
||||
|
||||
|
||||
@pytest.mark.smoke
|
||||
@pytest.mark.nondestructive
|
||||
def test_app_store_buttons_displayed(base_url, selenium):
|
||||
page = FirefoxSyncPage(selenium, base_url).open()
|
||||
assert page.is_play_store_button_displayed
|
||||
assert page.is_app_store_button_displayed
|
||||
|
|
@ -20,7 +20,7 @@ from pages.firefox.desktop.desktop import FirefoxDesktopPage
|
|||
from pages.firefox.desktop.customize import CustomizePage
|
||||
from pages.firefox.desktop.all import FirefoxDesktopBasePage
|
||||
from pages.firefox.home import FirefoxHomePage
|
||||
from pages.firefox.sync import FirefoxSyncPage
|
||||
from pages.firefox.features.feature import FeaturePage
|
||||
from pages.plugincheck import PluginCheckPage
|
||||
from pages.smarton.landing import SmartOnLandingPage
|
||||
from pages.smarton.base import SmartOnBasePage
|
||||
|
|
@ -43,7 +43,7 @@ from pages.smarton.base import SmartOnBasePage
|
|||
(FirefoxDesktopPage, None),
|
||||
(CustomizePage, None),
|
||||
(FirefoxDesktopBasePage, {'slug': 'trust'}),
|
||||
(FirefoxSyncPage, None),
|
||||
(FeaturePage, {'slug': 'sync'}),
|
||||
(PluginCheckPage, None),
|
||||
(SmartOnLandingPage, None),
|
||||
pytest.mark.skip_if_not_firefox((SmartOnBasePage, {'slug': 'tracking'}),
|
||||
|
|
|
|||
|
|
@ -1,30 +0,0 @@
|
|||
# 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/.
|
||||
|
||||
from selenium.webdriver.common.by import By
|
||||
|
||||
from pages.firefox.base import FirefoxBasePage
|
||||
from pages.regions.download_button import DownloadButton
|
||||
|
||||
|
||||
class FirefoxSyncPage(FirefoxBasePage):
|
||||
|
||||
URL_TEMPLATE = '/{locale}/firefox/sync'
|
||||
|
||||
_download_button_locator = (By.ID, 'download-button-desktop-release')
|
||||
_play_store_button_locator = (By.ID, 'cta-android-footer')
|
||||
_app_store_button_locator = (By.ID, 'cta-ios-footer')
|
||||
|
||||
@property
|
||||
def download_button(self):
|
||||
el = self.find_element(*self._download_button_locator)
|
||||
return DownloadButton(self, root=el)
|
||||
|
||||
@property
|
||||
def is_play_store_button_displayed(self):
|
||||
return self.is_element_displayed(*self._play_store_button_locator)
|
||||
|
||||
@property
|
||||
def is_app_store_button_displayed(self):
|
||||
return self.is_element_displayed(*self._app_store_button_locator)
|
||||
|
|
@ -222,7 +222,7 @@ URLS = flatten((
|
|||
url_test('/firefox/organizations/all.html', '/firefox/organizations/all/'),
|
||||
|
||||
# bug 729329
|
||||
url_test('/mobile/sync/is/da/best/', '/firefox/sync/'),
|
||||
url_test('/mobile/sync/is/da/best/', '/firefox/features/sync/'),
|
||||
|
||||
# bug 882845
|
||||
url_test('/firefox/toolkit/download-to-your-devices/because-i-say-so/', '/firefox/new/'),
|
||||
|
|
@ -313,7 +313,7 @@ URLS = flatten((
|
|||
|
||||
# Bug 1110927
|
||||
url_test('/firefox/start/central.html', '/firefox/new/'),
|
||||
url_test('/firefox/sync/firstrun.html', '/firefox/sync/'),
|
||||
url_test('/firefox/sync/firstrun.html', '/firefox/features/sync/'),
|
||||
|
||||
# bug 876810
|
||||
url_test('/hacking/commit-access-policy/',
|
||||
|
|
@ -1008,7 +1008,7 @@ URLS = flatten((
|
|||
url_test('/firefox/tiles/',
|
||||
'https://support.mozilla.org/kb/about-tiles-new-tab'),
|
||||
# Bug 1252332
|
||||
url_test('/sync/', '/firefox/sync/'),
|
||||
url_test('/sync/', '/firefox/features/sync/'),
|
||||
|
||||
url_test('/projects/bonecho/', '/firefox/channel/desktop/'),
|
||||
url_test('/projects/bonsai/', 'https://wiki.mozilla.org/Bonsai'),
|
||||
|
|
@ -1174,4 +1174,7 @@ URLS = flatten((
|
|||
|
||||
# Bug 1369732
|
||||
url_test('{/en-US,}/Firefox', '{/en-US,}/firefox/'),
|
||||
|
||||
# Bug 1370587
|
||||
url_test('/firefox/sync/', '/firefox/features/sync/'),
|
||||
))
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче