Review fixes

* Misc fixes to strings and Fluent files.
* Deleting obsolete CSS.
* Fix PiP JS
* Add image borders.

bedrock/firefox/templates/firefox/features/adblocker.html

@@ -39,7 +39,7 @@ <h2>{{ftl('features-adblocker-create-a-tracker-free') }}</h2>
 </figure>
 
 <h2>{{ftl('features-adblocker-choose-your-level-of-protection') }}</h2>
-<p>{{ ftl('features-adblocker-to-start-click-on-the') }}</p>
+<p>{{ ftl('features-adblocker-to-start-click-on-the-v2', fallback='features-adblocker-to-start-click-on-the') }}</p>
 
 <h2>{{ftl('features-adblocker-go-easy-with-standard') }}</h2>
 <p>{{ ftl('features-adblocker-if-ads-dont-bother-you', url=url('firefox.features.private-browsing')) }}</p>
@@ -127,5 +127,5 @@ <h2>{{ftl('features-adblocker-send-a-do-not-track-signal') }}</h2>
 
 <h2>{{ ftl('features-adblocker-speed-up-thanks-to-ad') }}</h2>
 <p>{{ ftl('features-adblocker-in-some-cases-an-ad-blocker') }}</p>
-<p>{{ ftl('features-adblocker-if-you-want-to-learn-more', url=url('firefox.new')) }}</p>
+<p>{{ ftl('features-adblocker-if-you-want-to-learn-more-v2', fallback='features-adblocker-if-you-want-to-learn-more', url=url('firefox.new')) }}</p>
 {% endblock %}

bedrock/firefox/templates/firefox/features/base-article.html

@@ -10,7 +10,7 @@
 
 {% block page_css %}
   {{ css_bundle('protocol-split') }}
-  {{ css_bundle('firefox-features-new-article') }}
+  {{ css_bundle('firefox-features-article') }}
 {% endblock page_css %}
 
 {% block article_title_short %}{% endblock %}
@@ -65,5 +65,5 @@ <h3>{{ ftl('features-shared-footer-cta-title') }}</h3>
 {% endblock content %}
 
 {% block js %}
-  {{ js_bundle('firefox_features_new_article') }}
+  {{ js_bundle('firefox_features_article') }}
 {% endblock %}

bedrock/firefox/templates/firefox/features/customize.html

@@ -36,9 +36,9 @@
     trending='href="https://addons.mozilla.org/firefox/search/?sort=hotness&type=statictheme&utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"',
     recommended='href="https://addons.mozilla.org/firefox/search/?promoted=recommended&sort=random&type=statictheme&utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"',
     music='href="https://addons.mozilla.org/firefox/themes/category/music/?utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"',
-    seasonal='href="https://addons.mozilla.org/firefox/themes/category/seasonal/?href="utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"',
-    sports='href="https://addons.mozilla.org/firefox/themes/category/sports/?href="utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"',
-    nature='href="https://addons.mozilla.org/firefox/themes/category/nature/?href="utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"'
+    seasonal='href="https://addons.mozilla.org/firefox/themes/category/seasonal/?utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"',
+    sports='href="https://addons.mozilla.org/firefox/themes/category/sports/?utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"',
+    nature='href="https://addons.mozilla.org/firefox/themes/category/nature/?utm_source=www.mozilla.org&utm_medium=referral&utm_campaign=firefox-features" rel="external noopener"'
   ) }}
 </p>
 

bedrock/firefox/templates/firefox/features/fingerprinting.html

@@ -8,7 +8,7 @@
 
 {% block page_desc %}{{ ftl('features-fingerprinting-fingerprinting-is-a-desc') }}{% endblock %}
 
-{% block article_title_short %}Fingerprinter blocking{% endblock %}
+{% block article_title_short %}{{ ftl('features-fingerprinting-fingerprint-blocking') }}{% endblock %}
 {% block article_title %}{{ ftl('features-fingerprinting-firefox-blocks-fingerprinting') }}{% endblock %}
 
 {% block article_content %}

bedrock/firefox/templates/firefox/features/index.html

@@ -24,7 +24,7 @@ <h3 class="c-feature-item-title">{{ title }}</h3>
 {%- endmacro %}
 
 {% block page_css %}
-  {{ css_bundle('firefox-features-new-index')}}
+  {{ css_bundle('firefox-features-index')}}
 {% endblock page_css %}
 
 {% block page_title %}{{ ftl('features-index-firefox-browser-features') }}{% endblock page_title %}
@@ -144,8 +144,8 @@ <h3 class="c-feature-item-title">{{ title }}</h3>
 
     {{ feature_item(
       link=url('firefox.features.fingerprinting'),
-      title=ftl('features-index-fingerprinter-blocking'),
-      ga_title="Fingerprinter blocking",
+      title=ftl('features-index-fingerprint-blocking'),
+      ga_title="Fingerprint blocking",
       desc=ftl('features-index-ditch-the-sticky-ads'),
     ) }}
 

bedrock/firefox/templates/firefox/features/picture-in-picture.html

@@ -89,5 +89,6 @@ <h3>{{ ftl('features-pip-3-more-ways-to-use-picture', fallback='features-pip-3-w
 {% endblock article_content %}
 
 {% block js %}
+  {{ super() }}
   {{ js_bundle('firefox-features-pip') }}
 {% endblock %}

bedrock/firefox/urls.py

@@ -37,14 +37,14 @@
     page("firefox/developer/", "firefox/developer/index.html", ftl_files=["firefox/developer"]),
     page("firefox/enterprise/", "firefox/enterprise/index.html", ftl_files=["firefox/enterprise"]),
     page("firefox/facebookcontainer/", "firefox/facebookcontainer/index.html", ftl_files=["firefox/facebook_container"]),
-    page("firefox/features/", "firefox/features/index.html", ftl_files=["firefox/features/index", "firefox/features/shared"]),
+    page("firefox/features/", "firefox/features/index.html", ftl_files=["firefox/features/index-2023", "firefox/features/shared"]),
     page("firefox/features/customize/", "firefox/features/customize.html", ftl_files=["firefox/features/customize", "firefox/features/shared"]),
     page("firefox/features/add-ons/", "firefox/features/add-ons.html", ftl_files=["firefox/features/add-ons", "firefox/features/shared"]),
     page("firefox/features/pinned-tabs/", "firefox/features/pinned-tabs.html", ftl_files=["firefox/features/pinned-tabs", "firefox/features/shared"]),
     page("firefox/features/eyedropper/", "firefox/features/eyedropper.html", ftl_files=["firefox/features/eyedropper", "firefox/features/shared"]),
     page("firefox/features/pdf-editor/", "firefox/features/pdf-editor.html", ftl_files=["firefox/features/pdf-editor", "firefox/features/shared"]),
     page("firefox/features/adblocker/", "firefox/features/adblocker.html", ftl_files=["firefox/features/adblocker", "firefox/features/shared"]),
-    page("firefox/features/bookmarks/", "firefox/features/bookmarks.html", ftl_files=["firefox/features/bookmarks", "firefox/features/shared"]),
+    page("firefox/features/bookmarks/", "firefox/features/bookmarks.html", ftl_files=["firefox/features/bookmarks-2023", "firefox/features/shared"]),
     page("firefox/features/fast/", "firefox/features/fast.html", ftl_files=["firefox/features/fast", "firefox/features/shared"]),
     page(
         "firefox/features/block-fingerprinting/",
@@ -54,7 +54,7 @@
     page(
         "firefox/features/password-manager/",
         "firefox/features/password-manager.html",
-        ftl_files=["firefox/features/password-manager", "firefox/features/shared"],
+        ftl_files=["firefox/features/password-manager-2023", "firefox/features/shared"],
     ),
     page(
         "firefox/features/private/",
@@ -64,7 +64,7 @@
     page(
         "firefox/features/private-browsing/",
         "firefox/features/private-browsing.html",
-        ftl_files=["firefox/features/private-browsing", "firefox/features/shared"],
+        ftl_files=["firefox/features/private-browsing-2023", "firefox/features/shared"],
     ),
     page("firefox/features/sync/", "firefox/features/sync.html", ftl_files=["firefox/features/sync", "firefox/features/shared"]),
     path("firefox/features/translate/", views.firefox_features_translate, name="firefox.features.translate"),

l10n/en/firefox/features/adblocker.ftl

@@ -38,7 +38,10 @@ features-adblocker-create-a-tracker-free = Create a tracker-free zone with Conte
 features-adblocker-on-firefox-you-can-use = On { -brand-name-firefox }, you can use <a href="{ $privacy }">Privacy</a> or <a href="{ $blocking }">Content Blocking</a> settings to get even more control over ad trackers that serve you the ads.
 
 features-adblocker-choose-your-level-of-protection = Choose your level of protection
-features-adblocker-to-start-click-on-the = To start, click the shield to the left of the address bar on any webpage and select “Protection Settings.” This will open the { -brand-name-firefox } Settings Privacy & Security panel in a new tab. You should see a blue pop-up with different selections.
+features-adblocker-to-start-click-on-the-v2 = To start, click the shield to the left of the address bar on any webpage and select “Protection Settings.” This will open the { -brand-name-firefox } Settings Privacy & Security panel in a new tab. You should see a blue pop-up with different selections.
+
+# Obsolete string
+features-adblocker-to-start-click-on-the = To start, click on the { -brand-name-firefox } menu in the top right-hand corner of your screen. It looks like three lines stacked on top of each other. In the drop-down menu, click on Content Blocking. You should see a blue pop-up with different selections.
 features-adblocker-go-easy-with-standard = Go easy with Standard mode
 
 # Variables:
@@ -69,4 +72,7 @@ features-adblocker-in-some-cases-an-ad-blocker = In some cases, an ad blocker ca
 
 # Variables:
 #   $url (url) - link to https://www.mozilla.org/firefox/new/
-features-adblocker-if-you-want-to-learn-more = If you want to learn more about ad blocking, there are hundreds of ad blocker extensions available for { -brand-name-firefox } and other browsers. If you want to try out the ad blockers { -brand-name-firefox } uses, <a href="{ $url }">click here to download</a> a browser that puts privacy first.
+features-adblocker-if-you-want-to-learn-more-v2 = If you want to learn more about ad blocking, there are hundreds of ad blocker extensions available for { -brand-name-firefox } and other browsers. If you want to try out the ad blockers { -brand-name-firefox } uses, <a href="{ $url }">click here to download</a> a browser that puts privacy first.
+
+# Obsolete string
+features-adblocker-if-you-want-to-learn-more = If you want to learn more about ad blocking, there are hundreds of ad blocker extensions available for { -brand-name-firefox } and other browsers. If want to try out the ad blockers { -brand-name-firefox } uses, <a href="{ $url }">click here to download</a> a browser that puts privacy first.

l10n/en/firefox/features/fingerprinting.ftl

@@ -10,6 +10,7 @@ features-fingerprinting-what-is-fingerprinting-title = What is fingerprinting an
 # page description
 features-fingerprinting-fingerprinting-is-a-desc = Fingerprinting is a type of online tracking that’s more invasive than ordinary cookie-based tracking — that’s why { -brand-name-firefox-browser } blocks it.
 
+features-fingerprinting-fingerprint-blocking = Fingerprint blocking
 features-fingerprinting-firefox-blocks-fingerprinting = { -brand-name-firefox } blocks fingerprinting
 features-fingerprinting-ditch-the-sticky = Ditch the sticky ads following you around with { -brand-name-firefox } browser’s built-in fingerprinting blockers.
 

l10n/en/firefox/features/index.ftl → l10n/en/firefox/features/index-2023.ftl

@@ -32,7 +32,7 @@ features-index-eyedropper-tool = Eyedropper tool
 features-index-identify-the-exact-color-on-a = Identify the exact color on a page and copy its hex code.
 features-index-pdf-editor = PDF editor
 features-index-view-and-edit-pdf-files = View and edit PDF files right in { -brand-name-firefox }.
-features-index-fingerprinter-blocking = Fingerprinter blocking
+features-index-fingerprint-blocking = Fingerprint blocking
 features-index-ad-tracker-blocking = Ad tracker blocking
 features-index-firefox-automatically-blocks = { -brand-name-firefox } automatically blocks 2000+ ad trackers from following you around the internet.
 

media/css/firefox/features/new/article.scss → media/css/firefox/features/article.scss

@@ -56,6 +56,10 @@ $image-path: '/media/protocol/img';
         margin: $spacing-lg 0;
         text-align: center;
 
+        img {
+            border: 1px solid $color-marketing-gray-30;
+        }
+
         figcaption {
             font-style: italic;
         }