Merge/mk 027 checkbox tocs (#2434)

* add fx-integration.mmd sequence diagram

* add localization copy

* Protemps logo (#2404)

* fix advisory

* Pontoon: Update Norwegian Nynorsk (nn-NO) localization of Firefox Monitor Website

Co-authored-by: Björn I. <bjorni.svindseth@yahoo.com>

* Pontoon: Update Norwegian Nynorsk (nn-NO) localization of Firefox Monitor Website

Co-authored-by: Björn I. <bjorni.svindseth@yahoo.com>

* Pontoon: Update Norwegian Nynorsk (nn-NO) localization of Firefox Monitor Website

Co-authored-by: Björn I. <bjorni.svindseth@yahoo.com>

* change "WiFi" localization to "Wi-Fi"

* Pontoon: Update Ukrainian (uk) localization of Firefox Monitor Website

Co-authored-by: Іhor Hordiichuk <igor_ck@outlook.com>

* Pontoon: Update Spanish (Chile) (es-CL) localization of Firefox Monitor Website

Co-authored-by: ravmn <ravmn@ravmn.cl>

* Pontoon: Update Swedish (sv-SE) localization of Firefox Monitor Website

Co-authored-by: Andreas Pettersson <az@kth.se>

* Pontoon: Update Greek (el) localization of Firefox Monitor Website

Co-authored-by: Jim Spentzos <jimspentzos2000@gmail.com>

* Pontoon: Update Chinese (China) (zh-CN) localization of Firefox Monitor Website

Co-authored-by: 你我皆凡人 <yuanbingyan@mail.ee>

* Pontoon: Update Vietnamese (vi) localization of Firefox Monitor Website

Co-authored-by: Quế Tùng <best.cloney.1301@gmail.com>

* Pontoon: Update Chinese (Taiwan) (zh-TW) localization of Firefox Monitor Website

Co-authored-by: Pin-guang Chen <petercpg@mail.moztw.org>

* Pontoon: Update Spanish (Argentina) (es-AR) localization of Firefox Monitor Website

Co-authored-by: Marcelo Poli <enzomatrix@gmail.com>

* Pontoon: Update Chinese (China) (zh-CN) localization of Firefox Monitor Website

Co-authored-by: 你我皆凡人 <yuanbingyan@mail.ee>

* Pontoon: Update Norwegian Nynorsk (nn-NO) localization of Firefox Monitor Website

Co-authored-by: Björn I. <bjorni.svindseth@yahoo.com>

* Pontoon: Update Hungarian (hu) localization of Firefox Monitor Website

Co-authored-by: Balázs Meskó <meskobalazs@mailbox.org>

* Pontoon: Update Welsh (cy) localization of Firefox Monitor Website

Co-authored-by: Rhoslyn Prys <rprys@posteo.net>

* Pontoon: Update Guarani (gn) localization of Firefox Monitor Website

Co-authored-by: Abelardo Ayala Rodríguez <abe_aya@hotmail.com>

* Pontoon: Update German (de) localization of Firefox Monitor Website

Co-authored-by: Michael Köhler <michael.koehler1@gmx.de>

* Pontoon: Update Spanish (Mexico) (es-MX) localization of Firefox Monitor Website

Co-authored-by: Bund10z <abu.avila@gmail.com>

* add validation to email partials

* Pontoon: Update Portuguese (Brazil) (pt-BR) localization of Firefox Monitor Website

Co-authored-by: Marcelo Ghelman <marcelo.ghelman@gmail.com>
Co-authored-by: Luana Coelho <luanamaira@gmail.com>

* Pontoon: Update Slovak (sk) localization of Firefox Monitor Website

Co-authored-by: Vlado Valaštiak <valastiak@mozilla.sk>

* Pontoon: Update Spanish (Spain) (es-ES) localization of Firefox Monitor Website

Co-authored-by: jlG <jlg.l10n.es@gmail.com>

* Pontoon: Update Dutch (nl) localization of Firefox Monitor Website

Co-authored-by: Mark Heijl <markh@babelzilla.org>

* Add RedLine Stealer breach logo (#2423)

* Pontoon: Update Portuguese (Portugal) (pt-PT) localization of Firefox Monitor Website

Co-authored-by: Cláudio Esperança <cesperanc@gmail.com>

* Add DatPiff logo (#2431)

* Add FlexBooker logo (#2432)

* create pages for the removal pilot terms and privacy policy
link to these pages from the enroll form
require user to click a checkbox for the enroll form before submitting.

Co-authored-by: Luke Crouch <lcrouch@mozilla.com>
Co-authored-by: Amri Toufali <atoufali@mozilla.com>
Co-authored-by: Kaitlyn Andres <kandres@mozilla.com>
Co-authored-by: Amri Toufali <amri@handsomemedia.com>
Co-authored-by: Björn I <bjorni.svindseth@yahoo.com>
Co-authored-by: Іhor Hordiichuk <igor_ck@outlook.com>
Co-authored-by: ravmn <ravmn@ravmn.cl>
Co-authored-by: Andreas Pettersson <az@kth.se>
Co-authored-by: Jim Spentzos <jimspentzos2000@gmail.com>
Co-authored-by: 你我皆凡人 <yuanbingyan@mail.ee>
Co-authored-by: Quế Tùng <best.cloney.1301@gmail.com>
Co-authored-by: Pin-guang Chen <petercpg@mail.moztw.org>
Co-authored-by: Marcelo Poli <enzomatrix@gmail.com>
Co-authored-by: Balázs Meskó <meskobalazs@mailbox.org>
Co-authored-by: Rhoslyn Prys <rprys@posteo.net>
Co-authored-by: Abelardo Ayala Rodríguez <abe_aya@hotmail.com>
Co-authored-by: Michael Köhler <michael.koehler1@gmx.de>
Co-authored-by: Bund10z <abu.avila@gmail.com>
Co-authored-by: Luana Coelho <luanamaira@gmail.com>
Co-authored-by: Marcelo Ghelman <marcelo.ghelman@gmail.com>
Co-authored-by: Vlado Valaštiak <valastiak@mozilla.sk>
Co-authored-by: jlG <jlg.l10n.es@gmail.com>
Co-authored-by: Mark Heijl <markh@babelzilla.org>
Co-authored-by: Maxx Crawford <maxx.crawford@gmail.com>
Co-authored-by: luke crouch <luke.crouch@gmail.com>
Co-authored-by: Cláudio Esperança <cesperanc@gmail.com>

controllers/home.js

@@ -172,6 +172,20 @@ function getRemovalFAQPage(req, res) {
   });
 }
 
+function getRemovalPilotTermsPage(req, res) {
+  return res.render("top-level-page", {
+    title: "Data Removal Pilot Terms of Service",
+    whichPartial: "top-level/removal-pilot-terms",
+  });
+}
+
+function getRemovalPilotPrivacyPage(req, res) {
+  return res.render("top-level-page", {
+    title: "Data Removal Pilot Privacy Notice",
+    whichPartial: "top-level/removal-pilot-privacy",
+  });
+}
+
 module.exports = {
   addEmailToWaitlist,
   getAboutPage,
@@ -182,4 +196,6 @@ module.exports = {
   notFound,
   removeMyData,
   getRemovalFAQPage,
+  getRemovalPilotTermsPage,
+  getRemovalPilotPrivacyPage,
 };

docs/fx-integration.mmd

@@ -0,0 +1,7 @@
+sequenceDiagram
+    Firefox->>accounts.firefox.com: POST /oauth/token grant_type:fxa-credentials
+    accounts.firefox.com->>Firefox: {access_token: ...}
+    Firefox->>monitor.firefox.com: GET /user/breach-stats Bearer: $access_token
+    monitor.firefox.com->>accounts.firefox.com: POST /oauth/verify $access_token
+    accounts.firefox.com->>monitor.firefox.com: {user: ...}
+    monitor.firefox.com->>Firefox: {breaches ...}

public/scss/includes/_vars.scss

@@ -15,4 +15,7 @@ $status-in-progress-color: #0060df;
 $status-blocked-color: #ee0700;
 
 //z-index
-$z-modal: 10;
+$z-modal: 10;
+
+//dimensions
+$header-height: 80px;

public/scss/partials/data-removal/remove-enroll.scss

@@ -23,6 +23,10 @@
     @include list-item-inside;
   }
 
+  &-terms {
+    margin-right: 10px;
+  }
+
   &-submit {
     margin-top: 25px;
   }

public/scss/partials/data-removal/remove-faq.scss

@@ -1,5 +1,5 @@
 .remove-faq {
-  padding-top: 80px; //MH must match header height
+  padding-top: $header-height; //MH must match header height
   &__header {
     background-color: var(--inkDark);
     padding: 84px 0;
@@ -147,4 +147,4 @@
       }
     }
   }
-}
+}

remove_en/remove.ftl

@@ -217,7 +217,9 @@ remove-enroll-terms = The pilot service will be offered at no cost to you for a
  You may discontinue the { remove-process-name } service at any point within the 90 day pilot period.
 remove-enroll-link-faq = { -product-name } { remove-pilot-title } FAQ
 remove-enroll-link-tos = { remove-pilot-title } Terms of Service and Privacy Notice
-remove-enroll-terms-agreement = By continuing, I agree to the Terms of Service and Privacy Notice.
+remove-enroll-terms-agreement = By continuing, I agree to the
+remove-enroll-terms-link = Terms of Service
+remove-enroll-privacy-link = Privacy Notice
 remove-enroll-submit = Join the pilot
 
 # Data Removal Pilot Enrollment Full Page

routes/home.js

@@ -11,6 +11,8 @@ const {
   getBentoStrings,
   getSecurityTips,
   getRemovalFAQPage,
+  getRemovalPilotPrivacyPage,
+  getRemovalPilotTermsPage,
   notFound,
   removeMyData,
   addEmailToWaitlist,
@@ -34,9 +36,7 @@ router.get("/breaches", getAllBreaches);
 router.get("/security-tips", getSecurityTips);
 router.get("/getBentoStrings", getBentoStrings);
 router.get("/iplocation", getIpLocation);
-//DATA REMOVAL SPECIFIC
 router.get("/remove-my-data", requireSessionUser, removeMyData); //MH TODO: think this can be deleted and its associated files
-router.get("/remove-faq", getRemovalFAQPage);
 //MH TODO: this can be deleted and its associated files(?)
 router.post(
   "/join-waitlist",
@@ -44,6 +44,10 @@ router.post(
   requireSessionUser,
   addEmailToWaitlist
 );
+//DATA REMOVAL SPECIFIC
+router.get("/remove-faq", getRemovalFAQPage);
+router.get("/removal-pilot-terms", getRemovalPilotTermsPage);
+router.get("/removal-pilot-privacy", getRemovalPilotPrivacyPage);
 //END DATA REMOVAL SPECIFIC
 
 router.use(notFound);

views/partials/dashboards/remove-enroll.hbs

@@ -21,9 +21,12 @@
     <div class="flx">
       <form id="remove-enroll-form" action="/user/remove-enroll-submit">
         <input type="hidden" name="_csrf" value="{{ csrfToken }}">
-        <p>
-          <a href="#">{{getRemoveString "remove-enroll-terms-agreement"}}</a>
-        </p>
+        <div class="flx">
+          <input id="remove-enroll-terms" class="remove-enroll-terms" type="checkbox" name="terms" required>
+          <label for="remove-enroll-terms">{{getRemoveString "remove-enroll-terms-agreement"}} 
+            <a href="/removal-pilot-terms">{{getRemoveString "remove-enroll-terms-link"}}</a> &
+            <a href="/removal-pilot-privacy">{{getRemoveString "remove-enroll-privacy-link"}}</a></label>
+        </div>
         <input id="" class="js-enroll-submit remove-enroll-submit" type="submit" value="{{getRemoveString "remove-enroll-submit"}}"/>
       </form>
     </div>

views/partials/top-level/removal-pilot-privacy.hbs

@@ -0,0 +1,8 @@
+<main id="removal-pilot-privacy" class="remove-page dashboard clear-header flx flx-col" data-page-label="Removal Pilot Privacy">
+  <div class="mw-860 flx flx-col">
+    <h2 class="remove-enroll-title">{{getRemoveString "remove-pilot-title"}} {{getRemoveString "remove-enroll-privacy-link"}}</h2>
+    <p>TODO</p>
+  </div>
+  {{> dashboards/remove-form-kanary-footer}}
+</main>
+

views/partials/top-level/removal-pilot-terms.hbs

@@ -0,0 +1,8 @@
+<main id="removal-pilot-terms" class="remove-page dashboard clear-header flx flx-col" data-page-label="Removal Pilot Terms">
+  <div class="mw-860 flx flx-col">
+    <h2 class="remove-enroll-title">{{getRemoveString "remove-pilot-title"}} {{getRemoveString "remove-enroll-terms-link"}}</h2>
+    <p>TODO</p>
+  </div>
+  {{> dashboards/remove-form-kanary-footer}}
+</main>
+