diff --git a/bedrock/firefox/templates/firefox/all/base.html b/bedrock/firefox/templates/firefox/all/base.html index 94c1ddad02c..f86bdceba07 100644 --- a/bedrock/firefox/templates/firefox/all/base.html +++ b/bedrock/firefox/templates/firefox/all/base.html @@ -5,7 +5,6 @@ #} {% extends "firefox/base/base-protocol.html" %} -{% from "macros.html" import google_play_button, apple_app_store_button with context %} {% set android_url = play_store_url('firefox', 'firefox-all') %} {% set ios_url = app_store_url('firefox', 'firefox-all') %} @@ -41,14 +40,42 @@

{{ ftl('firefox-all-choose-which-firefox') }}

{{ self.page_desc() }}

- {% block main %} - {% endblock %} + {% include 'firefox/all/product.html' %} + {% include 'firefox/all/platform.html' %} + {% include 'firefox/all/lang.html' %} + {% include 'firefox/all/download.html' %}
-{% block modal %} -{% endblock %} +
+ +
{% endblock %} diff --git a/bedrock/firefox/templates/firefox/all/download.html b/bedrock/firefox/templates/firefox/all/download.html index b042dff12db..44cc2b9ca2f 100644 --- a/bedrock/firefox/templates/firefox/all/download.html +++ b/bedrock/firefox/templates/firefox/all/download.html @@ -3,15 +3,57 @@ License, v. 2.0. If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/. #} -{% extends "firefox/all/base.html" %} -{% block main %} +{% from "macros.html" import google_play_button, apple_app_store_button with context %} - {# Show download #} -
- - {{ ftl('download-button-download-now') }} - + + +{# Show download #} + +
4. Download
+ +{% if product and platform and locale %} +
+ + {{ ftl('download-button-download-now') }} + +
+ + +

+ {{ ftl('download-button-using-debian', attrs='href="https://support.mozilla.org/kb/install-firefox-linux#w_install-firefox-deb-package-for-debian-based-distributions" rel="external noopener" data-cta-type="link" data-cta-text="You can set up our APT repository instead"'|safe) }} +

+ + + + + {{ ftl('download-button-download-now') }} + + +
+ +
+ +
+ {{ google_play_button(href=android_beta_url, id='playStoreLink-beta') }}
-{% endblock %} +
+ {{ google_play_button(href=android_nightly_url, id='playStoreLink-nightly') }} +
+ +
+ +
+
+{% endif %} diff --git a/bedrock/firefox/templates/firefox/all/installer.html b/bedrock/firefox/templates/firefox/all/installer.html deleted file mode 100644 index af0115e9c9b..00000000000 --- a/bedrock/firefox/templates/firefox/all/installer.html +++ /dev/null @@ -1,58 +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 https://mozilla.org/MPL/2.0/. - #} - {% extends "firefox/all/base.html" %} - - {% block main %} - {# Choose platform #} - {% if product %} -

{{ ftl('firefox-all-select-your-preferred-installer') }} - - {{ ftl('firefox-all-get-help') }} - -

- {% if platform %} -

{{ platform_name }}

- {% else %} - - {% endif %} - {% endif %} -{% endblock%} - - -{% block modal %} -
- -
-{% endblock %} diff --git a/bedrock/firefox/templates/firefox/all/lang.html b/bedrock/firefox/templates/firefox/all/lang.html index 400e4e6cfe7..1bcd71bd537 100644 --- a/bedrock/firefox/templates/firefox/all/lang.html +++ b/bedrock/firefox/templates/firefox/all/lang.html @@ -3,261 +3,21 @@ License, v. 2.0. If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/. #} -{% extends "firefox/base/base-protocol.html" %} -{% from "macros.html" import google_play_button, apple_app_store_button with context %} -{% set android_url = play_store_url('firefox', 'firefox-all') %} -{% set ios_url = app_store_url('firefox', 'firefox-all') %} - -{%- block page_title -%} - {{ ftl('firefox-all-download-the-firefox') }} -{%- endblock -%} - -{%- block page_desc -%} - {{ ftl('firefox-all-everyone-deserves-access') }} -{%- endblock -%} - -{% block page_css %} - {{ css_bundle('firefox_all_unified') }} -{% endblock %} - -{% block old_ie_styles %} - {{ super() }} - {{ css_bundle('firefox_all_unified_old_ie') }} -{% endblock %} - -{% block site_header %} - {% with hide_nav_cta=True %} - {% include 'includes/protocol/navigation/navigation.html' %} - {% endwith %} -{% endblock %} - -{% block content %} -
-
-
- -
- {% if product %} -

< start over

- {% endif %} - - {# Choose product #} -

{{ ftl('firefox-all-which-browser-would') }} - - {{ ftl('firefox-all-get-help') }} - -

- {% if product %} -

{{ product and product.name }}

- {% else %} -

Desktop

-
    - {% for p in products %} - {% if p.slug.startswith('desktop-release') %} -
  • {{ p.name }}
  • - {% endif %} - {% endfor %} -
- -

Or get a non-standard version

- -
    - {% for p in products %} - {% if p.slug.startswith('desktop') and not p.slug.endswith('release') %} -
  • {{ p.name }}
  • - {% endif %} - {% endfor %} -
- -

Mobile

- - - -

Or get a non-standard version

- -
    - {% for p in products %} - {% if p.slug.startswith('android') and not p.slug.endswith('release')%} -
  • {{ p.name }}
  • - {% endif %} - {% endfor %} -
- - {% endif %} - - {# Choose platform #} - {% if product %} -

{{ ftl('firefox-all-select-your-preferred-installer') }} - - {{ ftl('firefox-all-get-help') }} - -

- {% if platform %} -

{{ platform_name }}

- {% else %} -
    - {% for platform, name in platforms %} -
  • {{ name }}
  • - {% endfor %} -
- {% endif %} - {% endif %} - - {# Choose language #} - {% if product and platform %} -

{{ ftl('firefox-all-select-your-preferred-language') }}

- {% if locale %} -

{{ locale_name }}

- {% else %} -
    - {% for locale, name in locales %} -
  • {{ name }}
  • - {% endfor %} -
- {% endif %} - {% endif %} - - {# Show download #} - {% if product and platform and locale %} -
- - {{ ftl('download-button-download-now') }} - -
- {% endif %} -
-
-
-
- -
- +{# Choose language #} +
+ 3. {{ ftl('firefox-all-language') }} + {% if product and platform and locale %} + {{ locale_name }} + X + {% endif %}
-
+{% if product and platform and not locale %} +

{{ ftl('firefox-all-select-your-preferred-language') }}

-
-{% endblock %} +{% endif %} diff --git a/bedrock/firefox/templates/firefox/all/mobile.html b/bedrock/firefox/templates/firefox/all/mobile.html deleted file mode 100644 index 400e4e6cfe7..00000000000 --- a/bedrock/firefox/templates/firefox/all/mobile.html +++ /dev/null @@ -1,263 +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 https://mozilla.org/MPL/2.0/. -#} -{% extends "firefox/base/base-protocol.html" %} - -{% from "macros.html" import google_play_button, apple_app_store_button with context %} -{% set android_url = play_store_url('firefox', 'firefox-all') %} -{% set ios_url = app_store_url('firefox', 'firefox-all') %} - -{%- block page_title -%} - {{ ftl('firefox-all-download-the-firefox') }} -{%- endblock -%} - -{%- block page_desc -%} - {{ ftl('firefox-all-everyone-deserves-access') }} -{%- endblock -%} - -{% block page_css %} - {{ css_bundle('firefox_all_unified') }} -{% endblock %} - -{% block old_ie_styles %} - {{ super() }} - {{ css_bundle('firefox_all_unified_old_ie') }} -{% endblock %} - -{% block site_header %} - {% with hide_nav_cta=True %} - {% include 'includes/protocol/navigation/navigation.html' %} - {% endwith %} -{% endblock %} - -{% block content %} -
-
-
- -
- {% if product %} -

< start over

- {% endif %} - - {# Choose product #} -

{{ ftl('firefox-all-which-browser-would') }} - - {{ ftl('firefox-all-get-help') }} - -

- {% if product %} -

{{ product and product.name }}

- {% else %} -

Desktop

-
    - {% for p in products %} - {% if p.slug.startswith('desktop-release') %} -
  • {{ p.name }}
  • - {% endif %} - {% endfor %} -
- -

Or get a non-standard version

- -
    - {% for p in products %} - {% if p.slug.startswith('desktop') and not p.slug.endswith('release') %} -
  • {{ p.name }}
  • - {% endif %} - {% endfor %} -
- -

Mobile

- - - -

Or get a non-standard version

- -
    - {% for p in products %} - {% if p.slug.startswith('android') and not p.slug.endswith('release')%} -
  • {{ p.name }}
  • - {% endif %} - {% endfor %} -
- - {% endif %} - - {# Choose platform #} - {% if product %} -

{{ ftl('firefox-all-select-your-preferred-installer') }} - - {{ ftl('firefox-all-get-help') }} - -

- {% if platform %} -

{{ platform_name }}

- {% else %} -
    - {% for platform, name in platforms %} -
  • {{ name }}
  • - {% endfor %} -
- {% endif %} - {% endif %} - - {# Choose language #} - {% if product and platform %} -

{{ ftl('firefox-all-select-your-preferred-language') }}

- {% if locale %} -

{{ locale_name }}

- {% else %} -
    - {% for locale, name in locales %} -
  • {{ name }}
  • - {% endfor %} -
- {% endif %} - {% endif %} - - {# Show download #} - {% if product and platform and locale %} - - {% endif %} -
-
-
-
- -
- -
- -
- -
-{% endblock %} diff --git a/bedrock/firefox/templates/firefox/all/platform.html b/bedrock/firefox/templates/firefox/all/platform.html new file mode 100644 index 00000000000..ed608475ac6 --- /dev/null +++ b/bedrock/firefox/templates/firefox/all/platform.html @@ -0,0 +1,28 @@ +{# + 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 https://mozilla.org/MPL/2.0/. + #} + + +{# Choose platform #} +
+ 2. {{ ftl('firefox-all-platform') }} + {% if product and platform %} + {{ platform_name }} + X + {% endif %} +
+ +{% if product and not platform %} +

{{ ftl('firefox-all-select-your-preferred-installer') }} + + {{ ftl('firefox-all-get-help') }} + +

+ +{% endif %} diff --git a/bedrock/firefox/templates/firefox/all/product.html b/bedrock/firefox/templates/firefox/all/product.html index 381d977ae76..64b2c04f505 100644 --- a/bedrock/firefox/templates/firefox/all/product.html +++ b/bedrock/firefox/templates/firefox/all/product.html @@ -3,90 +3,41 @@ License, v. 2.0. If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/. #} -{% extends "firefox/all/base.html" %} -{% block main %} - {# Choose product #} -

{{ ftl('firefox-all-which-browser-would') }} - - {{ ftl('firefox-all-get-help') }} - -

- {% if product %} -

{{ product and product.name }}

- {% else %} -

Desktop

- -
-

Or get a non-standard version

+{# Choose product #} - -
+
+ 1. {{ ftl('firefox-all-browser') }} + {% if product %} + {{ product and product.name }} + X + {% endif %} +
+ +{% if not product %} -

Mobile

- - +

{{ ftl('firefox-all-choose-which-firefox') }}

-
-

Or get a non-standard version

+

Desktop

+ - - -
- {% endif %} -
-{% endblock %} +

Mobile

-{% block modal %} -
-
-{% endblock %} + +{% endif %} diff --git a/bedrock/firefox/views.py b/bedrock/firefox/views.py index b3e2d13e00d..5ff74a7dc9d 100644 --- a/bedrock/firefox/views.py +++ b/bedrock/firefox/views.py @@ -365,7 +365,7 @@ def firefox_drilldown(request, product_slug=None, platform=None, locale=None): platform_name = None locale_name = None download_url = None - template_name = "firefox/all/product.html" # TKTK + template_name = "firefox/all/base.html" # The mobile products don't drill down, so short-circuit them here. if product: @@ -420,21 +420,18 @@ def firefox_drilldown(request, product_slug=None, platform=None, locale=None): context.update( locales=locales, ) - template_name = "firefox/all/installer.html" # Show locales. elif product_slug: context.update( platforms=product["product"].platforms(product["channel"]), ) - template_name = "firefox/all/lang.html" # Show products. else: context.update( products=[{"slug": k, "name": v["name"]} for k, v in product_map.items()], ) - template_name = "firefox/all/product.html" return l10n_utils.render(request, template_name, context, ftl_files=ftl_files) diff --git a/media/css/firefox/all/all-unified.scss b/media/css/firefox/all/all-unified.scss index 29ac1f74118..4d6a92967ff 100644 --- a/media/css/firefox/all/all-unified.scss +++ b/media/css/firefox/all/all-unified.scss @@ -13,6 +13,12 @@ $image-path: '/media/protocol/img'; @import '~@mozilla-protocol/core/protocol/css/components/modal'; @import '~@mozilla-protocol/core/protocol/css/components/sidebar-menu'; +.all-step { + font-weight: bold; + border-top: 1px solid rgba(0, 0, 0, 0.2); + margin-top: $layout-sm; +} + .c-product-select-form { @include clearfix; position: relative; @@ -99,8 +105,12 @@ $image-path: '/media/protocol/img'; li, .release { background: center left / contain no-repeat; - padding-left: 2em; - margin-bottom: 1em; + padding-left: 40px; + margin-bottom: 0.6rem; + } + + .release { + margin-bottom: 1.2rem; } .release,