Products
+{{ ftl('firefox-products-products') }}
- {{ ftl('firefox-products-firefox-beginning-emphasis', fallback='firefox-products-firefox-is-more-than-a-browser-emphasis') }}. - {{ ftl('firefox-products-mozillas-family-of-products', fallback='firefox-products-its-a-whole-family-of-products') }}. + {{ ftl('firefox-products-firefox-beginning-v2', fallback='firefox-products-firefox-beginning') }} + {{ ftl('firefox-products-mozillas-family-of-products-sentence', fallback='firefox-products-mozillas-family-of-products') }}
- - {% if mozilla_monitor %} - {{ ftl('firefox-products-mozilla-monitor', fallback='firefox-products-firefox-monitor') }} - {% else %} - {{ ftl('firefox-products-firefox-monitor') }} - {% endif %} - -
-{% if LANG == 'en-US' %}See if you’ve been part of a data breach. If so, let us automatically get your private info back for you and continually monitor your identity for new leaks.{% else %}{{ ftl('firefox-products-see-if-your-personal-information') }}{% endif %}
- -{{ ftl('firefox-products-firefox', fallback = 'firefox-products-firefox-browsers') }}
+ ), + ) %} +{{ ftl('firefox-products-firefox') }}
{{ ftl('firefox-products-get-the-browsers-that-block') }}
- - -{{ ftl('firefox-products-mozilla-vpn') }}
+ {% set alt_copy = ftl('download-button-download-firefox') + " " + icon_download|safe %} +{{ google_play_button(href=fx_android_url, id='playStoreLink-firefox') }}
+{{ apple_app_store_button(href=fx_ios_url, id='appStoreLink-firefox') }}
+ {% endcall %} + + + {% call picto( + body=True, + image=resp_img( + url='protocol/img/logos/firefox/browser/focus/logo.svg', + optional_attributes={ + 'class': 'mzp-c-picto-image', + 'width': '64', + 'height': '64', + 'loading': 'lazy' + } + ), + ) %} +{{ ftl('firefox-products-firefox-focus') }}
+{{ ftl('firefox-products-your-dedicated-privacy') }}
++
+ {% endcall %} + + + {% call picto( + body=True, + image=resp_img( + url='protocol/img/logos/firefox/relay/logo-white.svg', + optional_attributes={ + 'class': 'mzp-c-picto-image', + 'width': '64', + 'height': '64', + 'loading': 'lazy' + } + ), + ) %} + + +{{ ftl('firefox-products-relay') }}
+{{ ftl('firefox-products-protect-your-real') }}
+{{ ftl('firefox-products-get-relay') }} {{ icon_external|safe }} + {% endcall %} + + + {% call picto( + body=True, + image=resp_img( + url='protocol/img/logos/firefox/monitor/logo.svg', + optional_attributes={ + 'class': 'mzp-c-picto-image', + 'width': '64', + 'height': '64', + 'loading': 'lazy' + } + ), + ) %} +
{{ ftl('firefox-products-mozilla-monitor') }}
+{% if country_code == 'US' %}See if you’ve been part of a data breach. If so, let us automatically get your private info back for you and continually monitor your identity for new leaks.{% else %}{{ ftl('firefox-products-see-if-your-personal-information') }}{% endif %}
+ + {% endcall %} + + + {% call picto( + body=True, + image=resp_img( + url='protocol/img/logos/mozilla/vpn/logo.svg', + optional_attributes={ + 'class': 'mzp-c-picto-image', + 'width': '64', + 'height': '64', + 'loading': 'lazy' + } + ), + ) %} +{{ ftl('firefox-products-mozilla-vpn') }}
{{ ftl('firefox-products-surf-stream-and-get-work-done') }}
- -{{ ftl('firefox-products-pocket') }}
+{{ ftl('firefox-products-get-mozilla-vpn') }}
+ {% endcall %} + + + {% call picto( + body=True, + image=resp_img( + url='img/logos/mdn/mdn-plus-logo.svg', + optional_attributes={ + 'class': 'mzp-c-picto-image', + 'width': '64', + 'height': '64', + 'loading': 'lazy' + } + ), + ) %} +{{ ftl('firefox-products-mdn-plus') }}
+{{ ftl('firefox-products-resources-for-developers') }}
++ {{ ftl('firefox-products-support-mdn') }} {{ icon_external|safe }} +
+ {% endcall %} + + + {% call picto( + body=True, + image=resp_img( + url='img/logos/thunderbird/logo-thunderbird.svg', + optional_attributes={ + 'class': 'mzp-c-picto-image', + 'width': '64', + 'height': '64', + 'loading': 'lazy' + } + ), + ) %} +{{ ftl('firefox-products-thunderbird') }}
+{{ ftl('firefox-products-access-all') }}
+{{ ftl('firefox-products-download-thunderbird') }} {{ icon_download|safe }}
+ {% endcall %} + + + {% call picto( + body=True, + image=resp_img( + url='img/logos/fakespot/logo.svg', + optional_attributes={ + 'class': 'mzp-c-picto-image', + 'width': '64', + 'height': '64', + 'loading': 'lazy' + } + ), + ) %} +{{ ftl('firefox-products-fakespot') }} {{ ftl('firefox-products-by-mozilla') }}
+{{ ftl('firefox-products-fakespot-has-your') }}
+{{ ftl('firefox-products-analyze') }} {{ icon_external|safe }}
+ {% endcall %} + + + {% call picto( + body=True, + image=resp_img( + url='protocol/img/logos/pocket/logo.svg', + optional_attributes={ + 'class': 'mzp-c-picto-image', + 'width': '64', + 'height': '64', + 'loading': 'lazy' + } + ), + ) %} +{{ ftl('firefox-products-pocket') }} {{ ftl('firefox-products-by-mozilla') }}
{{ ftl('firefox-products-discover-the-best-content') }}
- - - -{{ ftl('firefox-products-relay') }}
-{{ ftl('firefox-products-protect-your-real') }}
- - -{{ ftl('firefox-products-firefox-focus') }}
-{{ ftl('firefox-products-your-dedicated-privacy') }}
+{{ ftl('firefox-products-get-pocket') }} {{ icon_external|safe }}
+{{ google_play_button(href=pocket_android_url, id='playStoreLink-pocket') }}
+{{ apple_app_store_button(href=pocket_ios_url, id='appStoreLink-pocket') }}
+ {% endcall %} - - -- margin-bottom: 1.25em; -} - -.mzp-c-menu-list-title { - margin-bottom: 0; -} - -.mzp-t-download .mzp-c-menu-list-item.t-web a:hover::after { +// hide the privacy notice to match the other buttons +.mzp-c-button-download-privacy-link { display: none; } -// vertical spacing -main .mzp-l-content { - padding-bottom: $v-grid-xs; - padding-top: $v-grid-xs; - - @media #{$mq-md} { - padding-bottom: $v-grid-md; - padding-top: $v-grid-md; - } - - @media #{$mq-lg} { - padding-bottom: $v-grid-lg; - padding-top: $v-grid-lg; - } -} - -// make buttons in drop down menus look like links -.c-menu-list-link { - &, - &.mzp-c-button.mzp-t-product { - background-color: inherit; - color: $color-link; - display: block; - font-family: inherit; - font-weight: normal; - padding: $spacing-sm 30px $spacing-sm $spacing-sm; - border: 0; - - &:hover { - color: $color-link-hover; - background-color: $color-marketing-gray-20; - } - } -} - -// * -------------------------------------------------------------------------- */ -// landing grid - -.c-landing-grid-item { - margin-bottom: $v-grid-xs * 2; // vertical spacing - margin-left: auto; - margin-right: auto; - max-width: 400px; - - &:last-child { - margin-bottom: 0; - } - - &.c-landing-grid-wide { - max-width: 100%; - } - - > p:last-child { - margin-bottom: 0; - } -} - -.c-landing-grid-title { - @include font-size(24px); - margin-bottom: $spacing-md; - margin-top: $spacing-xl; - - a { - color: $color-ink-80; - text-decoration: none; - - &:hover, - &:focus { - text-decoration: underline; - } - } - - + p { - margin-bottom: $spacing-xl; - } +// the space between the buttons was getting a link underline, this removes that +a[id^='playStoreLink'], +a[id^='appStoreLink'] { + display: inline-block; } -.c-landing-grid-img { - display: block; - margin: 0 auto; -} -// two column grid for browsers that don't support display:grid -// works in RTL without bidi styles \o/ -@media #{$mq-md} { - .c-landing-grid-item { - float: left; - margin-bottom: $v-grid-md * 2; - margin-left: $h-grid-md; - max-width: 100%; - width: calc(50% - #{$h-grid-md * 0.5}); +// -------------------------------------------------------------------------- +// conditional content classes - &:nth-child(odd) { - clear: left; - margin-left: 0; - } - } +.show-android, +.show-ios { + display: none !important; /* stylelint-disable-line declaration-no-important */ } -@media #{$mq-lg} { - .c-landing-grid-item { - margin-bottom: $v-grid-lg * 2; - margin-left: $h-grid-lg; - width: calc(50% - #{$h-grid-lg * 0.5}); - } +.android .hide-android, +.ios .hide-ios { + display: none !important; /* stylelint-disable-line declaration-no-important */ } -// column grid for browsers that do support grid -@supports (display:grid) { - // two column - @media #{$mq-md} { - .c-landing-grid { - @include grid-column-gap($h-grid-md); - @include grid-row-gap(#{$v-grid-md * 2}); - display: grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - - // need to remove :after added by .mzp-l-content or we get an extra grid row - // added for clearfix purposes but grids don't need a clearfix - .c-landing-grid::after { - content: none; - } - - .c-landing-grid-item { - margin-bottom: 0; // vertical spacing now set as row-gap instead of margin-bottom - margin-left: 0; - width: auto; // over-ride 50% width from float layout - } - - .c-landing-grid-img { - max-width: 100%; - } - } - - // three column - @media #{$mq-lg} { - .c-landing-grid { - @include grid-column-gap($h-grid-lg); - @include grid-row-gap(#{$v-grid-lg * 2}); - grid-template-columns: repeat(3, minmax(0, 1fr)); - } +.show-else { + .android &, + .ios & { + display: none !important; /* stylelint-disable-line declaration-no-important */ } } -// * -------------------------------------------------------------------------- */ -// Desktop download menu - -// issue 13317 -.fx-unsupported .menu-desktop { - display: none; +.ios .show-ios { + display: inline-block !important; /* stylelint-disable-line declaration-no-important */ } -// * -------------------------------------------------------------------------- */ -// Mobile download links - -#menu-browsers { - .ios & .menu-desktop, - .ios & .menu-android, - .android & .menu-desktop, - .android & .menu-ios { - a { - pointer-events: none; - color: $color-marketing-gray-50; - } - } +.android .show-android { + display: inline-block !important; /* stylelint-disable-line declaration-no-important */ } diff --git a/media/img/logos/fakespot/logo.svg b/media/img/logos/fakespot/logo.svg new file mode 100644 index 00000000000..ae09441fefe --- /dev/null +++ b/media/img/logos/fakespot/logo.svg @@ -0,0 +1 @@ + diff --git a/media/img/logos/mdn/mdn-plus-logo.svg b/media/img/logos/mdn/mdn-plus-logo.svg new file mode 100644 index 00000000000..5287ebbb2a8 --- /dev/null +++ b/media/img/logos/mdn/mdn-plus-logo.svg @@ -0,0 +1 @@ + diff --git a/media/img/logos/thunderbird/logo-thunderbird.svg b/media/img/logos/thunderbird/logo-thunderbird.svg index 7c5b0c4c2a6..399fce04e05 100644 --- a/media/img/logos/thunderbird/logo-thunderbird.svg +++ b/media/img/logos/thunderbird/logo-thunderbird.svg @@ -1,65 +1 @@ - + diff --git a/media/img/privacy/icon-mdn-plus.svg b/media/img/privacy/icon-mdn-plus.svg deleted file mode 100644 index ecc0e4851ba..00000000000 --- a/media/img/privacy/icon-mdn-plus.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/media/img/products/landing/browsers-high-res.jpg b/media/img/products/landing/browsers-high-res.jpg deleted file mode 100644 index 36d8fde6e4e..00000000000 Binary files a/media/img/products/landing/browsers-high-res.jpg and /dev/null differ diff --git a/media/img/products/landing/browsers.jpg b/media/img/products/landing/browsers.jpg deleted file mode 100644 index 5d96ed0ce99..00000000000 Binary files a/media/img/products/landing/browsers.jpg and /dev/null differ diff --git a/media/img/products/landing/firefox-focus-high-res.jpg b/media/img/products/landing/firefox-focus-high-res.jpg deleted file mode 100644 index 058b3687ba5..00000000000 Binary files a/media/img/products/landing/firefox-focus-high-res.jpg and /dev/null differ diff --git a/media/img/products/landing/firefox-focus.jpg b/media/img/products/landing/firefox-focus.jpg deleted file mode 100644 index abb6a6b3909..00000000000 Binary files a/media/img/products/landing/firefox-focus.jpg and /dev/null differ diff --git a/media/img/products/landing/monitor.svg b/media/img/products/landing/monitor.svg deleted file mode 100644 index 124d4606c75..00000000000 --- a/media/img/products/landing/monitor.svg +++ /dev/null @@ -1,44 +0,0 @@ - diff --git a/media/img/products/landing/pocket.svg b/media/img/products/landing/pocket.svg deleted file mode 100644 index 87e3ece4f88..00000000000 --- a/media/img/products/landing/pocket.svg +++ /dev/null @@ -1,27 +0,0 @@ - diff --git a/media/img/products/landing/relay.svg b/media/img/products/landing/relay.svg deleted file mode 100644 index 3dc8fddc05e..00000000000 --- a/media/img/products/landing/relay.svg +++ /dev/null @@ -1,29 +0,0 @@ - diff --git a/media/img/products/landing/vpn.svg b/media/img/products/landing/vpn.svg deleted file mode 100644 index bf934b8bfa2..00000000000 --- a/media/img/products/landing/vpn.svg +++ /dev/null @@ -1,33 +0,0 @@ -