{{ main_title }}
+{{ main_body_part_one }}
+{{ main_body_part_two }}
+ + {{ page_cta }} + + {% endcall %} +
+  }})
+
+ {% call split(
+ image=resp_img('img/firefox/whatsnew/whatsnew133/review-checker.png',
+ srcset={ 'img/firefox/whatsnew/whatsnew133/review-checker-high-res.png': '2x' },
+ optional_attributes={ 'class': 'mzp-c-split-media-asset'}
+ ),
+ media_after=True,
+ media_class='mzp-l-split-h-center'
+ ) %}
+
+
+
+{% endblock %}
+
+{% block js %}
+ {{ js_bundle('firefox_whatsnew_events') }}
+{% endblock %}
diff --git a/bedrock/firefox/templates/firefox/whatsnew/whatsnew-fx133-na-mobile.html b/bedrock/firefox/templates/firefox/whatsnew/whatsnew-fx133-na-mobile.html
new file mode 100644
index 00000000000..26daa0a9792
--- /dev/null
+++ b/bedrock/firefox/templates/firefox/whatsnew/whatsnew-fx133-na-mobile.html
@@ -0,0 +1,17 @@
+{#
+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/.
+#}
+
+{% from "macros.html" import google_play_button, apple_app_store_button with context %}
+
+{% extends "firefox/whatsnew/index.html" %}
+
+{% block experiments %}
+ {{ js_bundle('firefox_whatsnew_133_experiment_na_mobile') }}
+{% endblock %}
+
+{% block js %}
+ {{ js_bundle('firefox_whatsnew_events') }}
+{% endblock %}
diff --git a/bedrock/firefox/tests/test_base.py b/bedrock/firefox/tests/test_base.py
index 2cc45ef1182..af74ae3c95e 100644
--- a/bedrock/firefox/tests/test_base.py
+++ b/bedrock/firefox/tests/test_base.py
@@ -1339,6 +1339,285 @@ def test_fx_133_0_0_vpn_zh_tw_tw(self, render_mock):
template = render_mock.call_args[0][1]
assert template == ["firefox/whatsnew/whatsnew-fx133-vpn.html"]
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_fr_fr_v1(self, render_mock):
+ """Should use whatsnew-fx133-eu-newsletter.html template for fr locale in FR and v=1"""
+ req = self.rf.get("/firefox/whatsnew/?v=1", HTTP_CF_IPCOUNTRY="FR")
+ req.locale = "fr"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-eu-newsletter.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_fr_fr_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation-eu.html template for fr locale in FR and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="FR")
+ req.locale = "fr"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-eu.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_fr_fr_v3(self, render_mock):
+ """Should use whatsnew-fx133-donation-eu.html template for fr locale in FR and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="FR")
+ req.locale = "fr"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-eu.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_de_de_v1(self, render_mock):
+ """Should use whatsnew-fx133-eu-newsletter.html template for de locale in DE and v=1"""
+ req = self.rf.get("/firefox/whatsnew/?v=1", HTTP_CF_IPCOUNTRY="DE")
+ req.locale = "de"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-eu-newsletter.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_de_de_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation-eu.html template for de locale in DE and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="DE")
+ req.locale = "de"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-eu.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_de_de_v3(self, render_mock):
+ """Should use whatsnew-fx133-donation-eu.html template for de locale in DE and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="DE")
+ req.locale = "de"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-eu.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_gb_gb_v1(self, render_mock):
+ """Should use whatsnew-fx133-eu-newsletter.html template for de locale in GB and v=1"""
+ req = self.rf.get("/firefox/whatsnew/?v=1", HTTP_CF_IPCOUNTRY="GB")
+ req.locale = "en-GB"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-eu-newsletter.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_gb_gb_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation-eu.html template for en_GB locale in GB and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="GB")
+ req.locale = "en-GB"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-eu.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_gb_gb_v3(self, render_mock):
+ """Should use whatsnew-fx133-donation-eu.html template for en_GB locale in GB and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="GB")
+ req.locale = "en-GB"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-eu.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_us_us_v1(self, render_mock):
+ """Should use whatsnew-fx133-na-fakespot.html template for en_US locale in US and v=1"""
+ req = self.rf.get("/firefox/whatsnew/?v=1", HTTP_CF_IPCOUNTRY="US")
+ req.locale = "en-US"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-na-fakespot.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_us_us_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation-na.html template for en_US locale in US and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="US")
+ req.locale = "en-US"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-na.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_us_us_v3(self, render_mock):
+ """Should use whatsnew-fx133-donation-na.html template for en_US locale in US and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="US")
+ req.locale = "en-US"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-na.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_ca_ca_v1(self, render_mock):
+ """Should use firefox/whatsnew/whatsnew-fx133-na-mobile.html template for en_CA locale in CA and v=1"""
+ req = self.rf.get("/firefox/whatsnew/?v=1", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "en-CA"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-na-mobile.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_ca_ca_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation-na.html template for en_CA locale in CA and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "en-CA"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-na.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_ca_ca_v3(self, render_mock):
+ """Should use whatsnew-fx133-donation-na.html template for en_CA locale in CA and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "en-CA"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation-na.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_fr_ca_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation.html template for fr locale in CA and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "fr"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_fr_ca_v3(self, render_mock):
+ """Should use whatsnew-fx133-donatio.html template for fr locale in CA and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "fr"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_de_ca_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation.html template for de locale in CA and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "de"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_de_ca_v3(self, render_mock):
+ """Should use whatsnew-fx133-donatio.html template for de locale in CA and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "de"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_it_ca_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation.html template for it locale in CA and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "it"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_it_ca_v3(self, render_mock):
+ """Should use whatsnew-fx133-donatio.html template for it locale in CA and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "it"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_pl_ca_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation.html template for pl locale in CA and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "pl"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_pl_ca_v3(self, render_mock):
+ """Should use whatsnew-fx133-donatio.html template for pl locale in CA and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "pl"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_es_es_ca_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation.html template for es-ES locale in CA and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "es-ES"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_es_es_ca_v3(self, render_mock):
+ """Should use whatsnew-fx133-donatio.html template for es-ES locale in CA and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "es-ES"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_gb_ca_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation.html template for en-GB locale in CA and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "en-GB"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_gb_ca_v3(self, render_mock):
+ """Should use whatsnew-fx133-donatio.html template for en-GB locale in CA and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="CA")
+ req.locale = "en-GB"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_us_fr_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation.html template for en-US locale in FR and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="FR")
+ req.locale = "en-US"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_us_fr_v3(self, render_mock):
+ """Should use whatsnew-fx133-donatio.html template for en-US locale in FR and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="FR")
+ req.locale = "en-US"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_ca_fr_v2(self, render_mock):
+ """Should use whatsnew-fx133-donation.html template for en-CA locale in FR and v=2"""
+ req = self.rf.get("/firefox/whatsnew/?v=2", HTTP_CF_IPCOUNTRY="FR")
+ req.locale = "en-CA"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
+ @override_settings(DEV=True)
+ def test_fx_133_0_0_newsletter_en_ca_fr_v3(self, render_mock):
+ """Should use whatsnew-fx133-donatio.html template for en-CA locale in FR and v=3"""
+ req = self.rf.get("/firefox/whatsnew/?v=3", HTTP_CF_IPCOUNTRY="FR")
+ req.locale = "en-CA"
+ self.view(req, version="133.0")
+ template = render_mock.call_args[0][1]
+ assert template == ["firefox/whatsnew/whatsnew-fx133-donation.html"]
+
# end 133.0 whatsnew tests
diff --git a/bedrock/firefox/views.py b/bedrock/firefox/views.py
index c833aec4fa9..eee422c25a4 100644
--- a/bedrock/firefox/views.py
+++ b/bedrock/firefox/views.py
@@ -507,6 +507,15 @@ class WhatsnewView(L10nTemplateView):
"firefox/whatsnew/whatsnew-fx132-eu.html": ["firefox/whatsnew/whatsnew"],
"firefox/whatsnew/whatsnew-fx133-vpn.html": ["firefox/whatsnew/whatsnew"],
"firefox/whatsnew/whatsnew-fx134beta.html": ["firefox/whatsnew/whatsnew"],
+ "firefox/whatsnew/whatsnew-fx133-eu-newsletter.html": ["firefox/whatsnew/whatsnew"],
+ "firefox/whatsnew/whatsnew-fx133-na-fakespot.html": ["firefox/whatsnew/whatsnew"],
+ "firefox/whatsnew/whatsnew-fx133-na-mobile.html": [
+ "firefox/whatsnew/whatsnew-s2d",
+ "firefox/whatsnew/whatsnew",
+ ],
+ "firefox/whatsnew/whatsnew-fx133-donation.html": ["firefox/whatsnew/whatsnew"],
+ "firefox/whatsnew/whatsnew-fx133-donation-eu.html": ["firefox/whatsnew/whatsnew"],
+ "firefox/whatsnew/whatsnew-fx133-donation-na.html": ["firefox/whatsnew/whatsnew"],
}
# specific templates that should not be rendered in
@@ -635,6 +644,23 @@ def get_template_names(self):
elif version.startswith("133."):
if locale in self.wnp_133_vpn_langs and country in settings.VPN_MOBILE_SUB_COUNTRY_CODES:
template = "firefox/whatsnew/whatsnew-fx133-vpn.html"
+ elif country in ["GB", "FR", "DE"] and locale in ["en-GB", "de", "fr"]:
+ if variant == "2" or variant == "3":
+ template = "firefox/whatsnew/whatsnew-fx133-donation-eu.html"
+ else:
+ template = "firefox/whatsnew/whatsnew-fx133-eu-newsletter.html"
+ elif country == "US" and locale in ["en-US", "en-CA"]:
+ if variant == "2" or variant == "3":
+ template = "firefox/whatsnew/whatsnew-fx133-donation-na.html"
+ else:
+ template = "firefox/whatsnew/whatsnew-fx133-na-fakespot.html"
+ elif country == "CA" and locale in ["en-US", "en-CA"]:
+ if variant == "2" or variant == "3":
+ template = "firefox/whatsnew/whatsnew-fx133-donation-na.html"
+ else:
+ template = "firefox/whatsnew/whatsnew-fx133-na-mobile.html"
+ elif locale in ["fr", "de", "it", "pl", "es-ES", "en-GB", "en-US", "en-CA"]:
+ template = "firefox/whatsnew/whatsnew-fx133-donation.html"
else:
template = "firefox/whatsnew/index.html"
elif version.startswith("132."):
diff --git a/media/css/firefox/whatsnew/whatsnew-133-donation.scss b/media/css/firefox/whatsnew/whatsnew-133-donation.scss
new file mode 100644
index 00000000000..b142014de5b
--- /dev/null
+++ b/media/css/firefox/whatsnew/whatsnew-133-donation.scss
@@ -0,0 +1,29 @@
+// 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/.
+
+@import 'includes/base';
+@import '~@mozilla-protocol/core/protocol/css/includes/lib';
+@import '~@mozilla-protocol/core/protocol/css/components/notification-bar';
+
+.wnp-content-main {
+ .wnp-main-title {
+ @include text-title-md;
+
+ @media #{$mq-lg} {
+ @include text-title-lg;
+ }
+ }
+
+ .wnp-main-body {
+ @include text-body-md;
+ }
+
+ .mzp-c-split-media-asset {
+ margin: 0 auto;
+ }
+
+ .wnp-main-cta {
+ margin-top: $spacing-lg;
+ }
+}
diff --git a/media/css/firefox/whatsnew/whatsnew-133-fakespot.scss b/media/css/firefox/whatsnew/whatsnew-133-fakespot.scss
new file mode 100644
index 00000000000..fb57d58cc50
--- /dev/null
+++ b/media/css/firefox/whatsnew/whatsnew-133-fakespot.scss
@@ -0,0 +1,63 @@
+// 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/.
+
+@import 'includes/base';
+@import '~@mozilla-protocol/core/protocol/css/includes/lib';
+@import '~@mozilla-protocol/core/protocol/css/components/notification-bar';
+@import 'includes/mofo-donate-cta';
+
+.wnp-content-main {
+ .wnp-main-title {
+ @include font-size(40px);
+
+ @media #{$mq-lg} {
+ @include font-size(56px);
+ }
+ }
+
+ .wnp-main-body {
+ @include text-body-md;
+ color: #757575;
+
+ .shopping-icon {
+ @include image-replaced;
+ @include background-size(2.25ex, 2.25ex);
+ background-image: url("/media/img/firefox/whatsnew/whatsnew133/icon-shopping.svg");
+ background-repeat: no-repeat;
+ display: inline-block;
+ height: 2.25ex;
+ margin-bottom: -0.5ex;
+ width: 2.25ex;
+ }
+ }
+
+ .mzp-c-split-media-asset {
+ margin: 0 auto;
+ }
+}
+
+.wnp-footer {
+ text-align: center;
+}
+
+@media (prefers-color-scheme: dark) {
+ .wnp-content-main {
+ .wnp-main-title {
+ color: $color-white;
+ }
+
+ .wnp-main-body {
+ color: $color-moz-light-gray;
+
+ .shopping-icon {
+ background-image: url("/media/img/firefox/whatsnew/whatsnew133/icon-shopping-light.svg");
+ }
+
+ .wnp-body-cta:link {
+ color: $color-moz-light-gray;
+ }
+
+ }
+ }
+}
diff --git a/media/css/firefox/whatsnew/whatsnew-133-newsletter.scss b/media/css/firefox/whatsnew/whatsnew-133-newsletter.scss
new file mode 100644
index 00000000000..e87829a04d1
--- /dev/null
+++ b/media/css/firefox/whatsnew/whatsnew-133-newsletter.scss
@@ -0,0 +1,82 @@
+// 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/.
+
+@import 'includes/base';
+@import '~@mozilla-protocol/core/protocol/css/includes/lib';
+@import '~@mozilla-protocol/core/protocol/css/components/notification-bar';
+@import '~@mozilla-protocol/core/protocol/css/templates/multi-column';
+@import '~@mozilla-protocol/core/protocol/css/components/newsletter-form';
+@import 'includes/mofo-donate-cta';
+
+.wnp-main-content,
+.wnp-action-container {
+ @media #{$mq-md} {
+ max-width: 510px;
+ }
+}
+
+.wnp-main-image {
+ margin-bottom: $spacing-md;
+}
+
+.wnp-main-content {
+ .wnp-main-title {
+ @include font-size(40px);
+
+ @media #{$mq-lg} {
+ @include font-size(50px);
+ }
+ }
+
+ .wnp-main-body {
+ @include text-body-md;
+ }
+}
+
+.wnp-action-container {
+ header {
+ display: none;
+ }
+
+ .mzp-js-email-field,
+ select,
+ .mzp-c-button {
+ min-width: 100%;
+ }
+
+ #newsletter-submit + .mzp-c-fieldnote {
+ margin-top: $spacing-sm;
+ }
+}
+
+.wnp-footer {
+ text-align: center;
+}
+
+.wnp-sign-off {
+ margin-top: 0;
+}
+
+@media (prefers-color-scheme: dark) {
+ .mzp-l-columns {
+ background-color: $color-dark-gray-60;
+ color: $color-white;
+ }
+
+ .wnp-main-title {
+ color: $color-white;
+ }
+
+ .mzp-c-newsletter-form {
+ a,
+ a:hover,
+ a:visited {
+ color: $color-white;
+ }
+ }
+
+ .mzp-c-newsletter-thanks h3 {
+ color: $color-white;
+ }
+}
diff --git a/media/img/firefox/whatsnew/whatsnew133/fox-mailbox.png b/media/img/firefox/whatsnew/whatsnew133/fox-mailbox.png
new file mode 100644
index 00000000000..5589a90bc06
Binary files /dev/null and b/media/img/firefox/whatsnew/whatsnew133/fox-mailbox.png differ
diff --git a/media/img/firefox/whatsnew/whatsnew133/icon-shopping-light.svg b/media/img/firefox/whatsnew/whatsnew133/icon-shopping-light.svg
new file mode 100644
index 00000000000..833a34ac185
--- /dev/null
+++ b/media/img/firefox/whatsnew/whatsnew133/icon-shopping-light.svg
@@ -0,0 +1 @@
+
diff --git a/media/img/firefox/whatsnew/whatsnew133/icon-shopping.svg b/media/img/firefox/whatsnew/whatsnew133/icon-shopping.svg
new file mode 100644
index 00000000000..33b06a3a0cc
--- /dev/null
+++ b/media/img/firefox/whatsnew/whatsnew133/icon-shopping.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/media/img/firefox/whatsnew/whatsnew133/mofo-heart-high-res.png b/media/img/firefox/whatsnew/whatsnew133/mofo-heart-high-res.png
new file mode 100644
index 00000000000..b6542906657
Binary files /dev/null and b/media/img/firefox/whatsnew/whatsnew133/mofo-heart-high-res.png differ
diff --git a/media/img/firefox/whatsnew/whatsnew133/mofo-heart.png b/media/img/firefox/whatsnew/whatsnew133/mofo-heart.png
new file mode 100644
index 00000000000..8704dff6c1d
Binary files /dev/null and b/media/img/firefox/whatsnew/whatsnew133/mofo-heart.png differ
diff --git a/media/img/firefox/whatsnew/whatsnew133/review-checker-high-res.png b/media/img/firefox/whatsnew/whatsnew133/review-checker-high-res.png
new file mode 100644
index 00000000000..540000086ad
Binary files /dev/null and b/media/img/firefox/whatsnew/whatsnew133/review-checker-high-res.png differ
diff --git a/media/img/firefox/whatsnew/whatsnew133/review-checker.png b/media/img/firefox/whatsnew/whatsnew133/review-checker.png
new file mode 100644
index 00000000000..a88edddd97c
Binary files /dev/null and b/media/img/firefox/whatsnew/whatsnew133/review-checker.png differ
diff --git a/media/js/firefox/whatsnew/whatsnew-133-experiment-donation.es6.js b/media/js/firefox/whatsnew/whatsnew-133-experiment-donation.es6.js
new file mode 100644
index 00000000000..77c9dea1f94
--- /dev/null
+++ b/media/js/firefox/whatsnew/whatsnew-133-experiment-donation.es6.js
@@ -0,0 +1,47 @@
+/*
+ * 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/.
+ */
+
+import TrafficCop from '@mozmeao/trafficcop';
+import { isApprovedToRun } from '../../base/experiment-utils.es6.js';
+
+if (typeof window.dataLayer === 'undefined') {
+ window.dataLayer = [];
+}
+
+const href = window.location.href;
+
+const initTrafficCop = () => {
+ if (href.indexOf('v=') !== -1) {
+ if (href.indexOf('v=2') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'MOFO-donation',
+ variant: 'mofo-donation-v2'
+ });
+ } else if (href.indexOf('v=3') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'MOFO-donation',
+ variant: 'mofo-donation-v3'
+ });
+ }
+ } else if (TrafficCop) {
+ const cop = new TrafficCop({
+ variations: {
+ 'v=2': 50, // MoFo donate (version 2)
+ 'v=3': 50 // MoFo donate (version 3)
+ }
+ });
+ cop.init();
+ }
+};
+
+// Avoid entering automated tests into random experiments.
+if (isApprovedToRun()) {
+ initTrafficCop();
+}
diff --git a/media/js/firefox/whatsnew/whatsnew-133-experiment-eu.es6.js b/media/js/firefox/whatsnew/whatsnew-133-experiment-eu.es6.js
new file mode 100644
index 00000000000..5b1c8df9140
--- /dev/null
+++ b/media/js/firefox/whatsnew/whatsnew-133-experiment-eu.es6.js
@@ -0,0 +1,55 @@
+/*
+ * 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/.
+ */
+
+import TrafficCop from '@mozmeao/trafficcop';
+import { isApprovedToRun } from '../../base/experiment-utils.es6.js';
+
+if (typeof window.dataLayer === 'undefined') {
+ window.dataLayer = [];
+}
+
+const href = window.location.href;
+
+const initTrafficCop = () => {
+ if (href.indexOf('v=') !== -1) {
+ if (href.indexOf('v=1') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'EU-newsletter',
+ variant: 'eu-newsletter-page'
+ });
+ } else if (href.indexOf('v=2') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'EU-donation',
+ variant: 'eu-donation-v2'
+ });
+ } else if (href.indexOf('v=3') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'EU-donation',
+ variant: 'eu-donation-v3'
+ });
+ }
+ } else if (TrafficCop) {
+ const cop = new TrafficCop({
+ variations: {
+ 'v=1': 80, // Newsletter
+ 'v=2': 10, // MoFo donate (version 2)
+ 'v=3': 10 // MoFo donate (version 3)
+ }
+ });
+ cop.init();
+ }
+};
+
+// Avoid entering automated tests into random experiments.
+if (isApprovedToRun()) {
+ initTrafficCop();
+}
diff --git a/media/js/firefox/whatsnew/whatsnew-133-experiment-na-mobile.es6.js b/media/js/firefox/whatsnew/whatsnew-133-experiment-na-mobile.es6.js
new file mode 100644
index 00000000000..550d4496d21
--- /dev/null
+++ b/media/js/firefox/whatsnew/whatsnew-133-experiment-na-mobile.es6.js
@@ -0,0 +1,55 @@
+/*
+ * 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/.
+ */
+
+import TrafficCop from '@mozmeao/trafficcop';
+import { isApprovedToRun } from '../../base/experiment-utils.es6.js';
+
+if (typeof window.dataLayer === 'undefined') {
+ window.dataLayer = [];
+}
+
+const href = window.location.href;
+
+const initTrafficCop = () => {
+ if (href.indexOf('v=') !== -1) {
+ if (href.indexOf('v=1') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'NA-mobile',
+ variant: 'na-mobile-page'
+ });
+ } else if (href.indexOf('v=2') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'NA-mobile',
+ variant: 'na-donation-v2'
+ });
+ } else if (href.indexOf('v=3') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'NA-mobile',
+ variant: 'na-donation-v3'
+ });
+ }
+ } else if (TrafficCop) {
+ const cop = new TrafficCop({
+ variations: {
+ 'v=1': 80, // Mobile wnp
+ 'v=2': 10, // MoFo donate (version 2)
+ 'v=3': 10 // MoFo donate (version 3)
+ }
+ });
+ cop.init();
+ }
+};
+
+// Avoid entering automated tests into random experiments.
+if (isApprovedToRun()) {
+ initTrafficCop();
+}
diff --git a/media/js/firefox/whatsnew/whatsnew-133-experiment-na.es6.js b/media/js/firefox/whatsnew/whatsnew-133-experiment-na.es6.js
new file mode 100644
index 00000000000..551bea732f3
--- /dev/null
+++ b/media/js/firefox/whatsnew/whatsnew-133-experiment-na.es6.js
@@ -0,0 +1,55 @@
+/*
+ * 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/.
+ */
+
+import TrafficCop from '@mozmeao/trafficcop';
+import { isApprovedToRun } from '../../base/experiment-utils.es6.js';
+
+if (typeof window.dataLayer === 'undefined') {
+ window.dataLayer = [];
+}
+
+const href = window.location.href;
+
+const initTrafficCop = () => {
+ if (href.indexOf('v=') !== -1) {
+ if (href.indexOf('v=1') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'NA-fakespot',
+ variant: 'na-fakespot-page'
+ });
+ } else if (href.indexOf('v=2') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'NA-donation',
+ variant: 'na-donation-v2'
+ });
+ } else if (href.indexOf('v=3') !== -1) {
+ // GA4
+ window.dataLayer.push({
+ event: 'experiment_view',
+ id: 'EU-donation',
+ variant: 'na-donation-v3'
+ });
+ }
+ } else if (TrafficCop) {
+ const cop = new TrafficCop({
+ variations: {
+ 'v=1': 80, // Fakespot
+ 'v=2': 10, // MoFo donate (version 2)
+ 'v=3': 10 // MoFo donate (version 3)
+ }
+ });
+ cop.init();
+ }
+};
+
+// Avoid entering automated tests into random experiments.
+if (isApprovedToRun()) {
+ initTrafficCop();
+}
diff --git a/media/static-bundles.json b/media/static-bundles.json
index f627f6c6152..705edd35060 100644
--- a/media/static-bundles.json
+++ b/media/static-bundles.json
@@ -459,6 +459,24 @@
],
"name": "firefox_whatsnew_133_vpn"
},
+ {
+ "files": [
+ "css/firefox/whatsnew/whatsnew-133-newsletter.scss"
+ ],
+ "name": "firefox_whatsnew_133_newsletter"
+ },
+ {
+ "files": [
+ "css/firefox/whatsnew/whatsnew-133-fakespot.scss"
+ ],
+ "name": "firefox_whatsnew_133_fakespot"
+ },
+ {
+ "files": [
+ "css/firefox/whatsnew/whatsnew-133-donation.scss"
+ ],
+ "name": "firefox_whatsnew_133_donation"
+ },
{
"files": [
"css/firefox/whatsnew/whatsnew-134beta.scss"
@@ -1535,6 +1553,30 @@
],
"name": "firefox_whatsnew_132"
},
+ {
+ "files": [
+ "js/firefox/whatsnew/whatsnew-133-experiment-eu.es6.js"
+ ],
+ "name": "firefox_whatsnew_133_experiment_eu"
+ },
+ {
+ "files": [
+ "js/firefox/whatsnew/whatsnew-133-experiment-na.es6.js"
+ ],
+ "name": "firefox_whatsnew_133_experiment_na"
+ },
+ {
+ "files": [
+ "js/firefox/whatsnew/whatsnew-133-experiment-na-mobile.es6.js"
+ ],
+ "name": "firefox_whatsnew_133_experiment_na_mobile"
+ },
+ {
+ "files": [
+ "js/firefox/whatsnew/whatsnew-133-experiment-donation.es6.js"
+ ],
+ "name": "firefox_whatsnew_133_experiment_donation"
+ },
{
"files": [
"js/firefox/firefox-20th/firefox-20th.js"
+
+
+
+
+
+{% endblock %}
+
+{% block js %}
+ {{ js_bundle('firefox_whatsnew_events') }}
+ {{ js_bundle('newsletter') }}
+{% endblock %}
diff --git a/bedrock/firefox/templates/firefox/whatsnew/whatsnew-fx133-na-fakespot.html b/bedrock/firefox/templates/firefox/whatsnew/whatsnew-fx133-na-fakespot.html
new file mode 100644
index 00000000000..58bcab47723
--- /dev/null
+++ b/bedrock/firefox/templates/firefox/whatsnew/whatsnew-fx133-na-fakespot.html
@@ -0,0 +1,51 @@
+{#
+ 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/.
+#}
+
+{% from "macros-protocol.html" import split with context %}
+
+{% extends "firefox/whatsnew/base.html" %}
+
+{% block experiments %}
+ {{ js_bundle('firefox_whatsnew_133_experiment_na') }}
+{% endblock %}
+
+{% block page_css %}
+ {{ css_bundle('protocol-split') }}
+ {{ css_bundle('firefox_whatsnew_133_fakespot') }}
+{% endblock %}
+
+{% set utm_params = 'utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=wnp133-fakespot' %}
+
+{% block wnp_content %}
+
+
+
+ {{ main_title }}
+{{ main_body }}
+
+ {{ email_newsletter_form(
+ newsletters='mozilla-and-you',
+ title=None
+ )}}
+
+ Enjoy cyber sales with confidence
+Whether you’re shopping on Amazon, Best Buy or Walmart, Review Checker helps flag products with unreliable reviews so you can confidently vet potential gifts before spending your money online this holiday season.
++ Click on the price tag icon in the search bar while visiting a product page and find out if you can trust the reviews you’re reading. Learn more +
+ + Try it on Amazon + + {% endcall %} +