Commit e0367698 authored by Jason Prickett's avatar Jason Prickett
Browse files

Bug 1779514 - Add privacy segmentation screen for existing users in MR Onboarding r=pdahiya 

Differential Revision: https://phabricator.services.mozilla.com/D155287
parent 0787850e

browser/components/newtab/aboutwelcome/content/aboutwelcome.bundle.js

+1 −1
Original line number Diff line number Diff line
@@ -683,7 +683,7 @@ const ProtonScreenActionButtons = props => { 
  }



  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {

    className: "action-buttons"

    className: `action-buttons ${content.dual_action_buttons ? "dual-action-buttons" : ""}`

  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_MSLocalized__WEBPACK_IMPORTED_MODULE_1__.Localized, {

    text: (_content$primary_butt = content.primary_button) === null || _content$primary_butt === void 0 ? void 0 : _content$primary_butt.label

  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", {

browser/components/newtab/aboutwelcome/content/aboutwelcome.css

+13 −0
Original line number Diff line number Diff line
@@ -415,6 +415,19 @@ body[lwt-newtab-brighttext] { 
.onboardingContainer .screen[pos=split] .section-main .main-content .action-buttons .checkbox-container label {

  vertical-align: middle;

}

.onboardingContainer .screen[pos=split] .section-main .main-content .action-buttons.dual-action-buttons button {

  padding: 8px 16px;

}

.onboardingContainer .screen[pos=split] .section-main .main-content .action-buttons.dual-action-buttons .secondary-cta {

  display: block;

  position: relative;

  bottom: unset;

  margin-block: 5px 0;

}

.onboardingContainer .screen[pos=split] .section-main .main-content .action-buttons.dual-action-buttons .secondary-cta .secondary {

  margin-inline: 0;

  font-size: 13px;

}

.onboardingContainer .screen[pos=split] .section-main .main-content .action-buttons .secondary-cta {

  position: absolute;

  bottom: -30px;

browser/components/newtab/content-src/aboutwelcome/aboutwelcome.scss

+19 −0
Original line number Diff line number Diff line
@@ -321,6 +321,25 @@ body { 
              }

            }



            &.dual-action-buttons {



              button {

                padding: 8px 16px;

              }



              .secondary-cta {

                display: block;

                position: relative;

                bottom: unset;

                margin-block: 5px 0;



                .secondary {

                  margin-inline: 0;

                  font-size: 13px;

                }

              }

            }



            .secondary-cta {

              position: absolute;

              bottom: -30px;

browser/components/newtab/content-src/aboutwelcome/components/MultiStageProtonScreen.jsx

+5 −1
Original line number Diff line number Diff line
@@ -62,7 +62,11 @@ export const ProtonScreenActionButtons = props => { 
  }



  return (

    <div className="action-buttons">

    <div

      className={`action-buttons ${

        content.dual_action_buttons ? "dual-action-buttons" : ""

      }`}

    >

      <Localized text={content.primary_button?.label}>

        <button

          className="primary"

browser/components/newtab/lib/OnboardingMessageProvider.jsm

+54 −0
Original line number Diff line number Diff line
@@ -411,6 +411,60 @@ const ONBOARDING_MESSAGES = () => [ 
            },

          },

        },

        {

          id: "UPGRADE_PRIVACY_SEGMENTATION",

          content: {

            position: "split",

            progress_bar: "true",

            dual_action_buttons: true,

            background:

              "url('chrome://activity-stream/content/data/content/assets/mr-pintaskbar.svg') var(--mr-secondary-position) no-repeat, var(--in-content-page-background) radial-gradient(83.12% 83.12% at 80.59% 16.88%, rgba(103, 51, 205, 0.75) 0%, rgba(0, 108, 207, 0.75) 54.51%, rgba(128, 199, 247, 0.75) 100%)",

            logo: {},

            title: {

              string_id: "mr2022-onboarding-privacy-segmentation-title",

            },

            subtitle: {

              string_id: "mr2022-onboarding-privacy-segmentation-subtitle",

            },

            cta_paragraph: {

              text: {

                string_id: "mr2022-onboarding-privacy-segmentation-text-cta",

              },

            },

            primary_button: {

              label: {

                string_id:

                  "mr2022-onboarding-privacy-segmentation-button-primary-label",

              },

              action: {

                type: "SET_PREF",

                data: {

                  pref: {

                    name: "browser.privacySegmentation.enabled",

                    value: true,

                  },

                },

                navigate: true,

              },

            },

            secondary_button: {

              label: {

                string_id:

                  "mr2022-onboarding-privacy-segmentation-button-secondary-label",

              },

              action: {

                type: "SET_PREF",

                data: {

                  pref: {

                    name: "browser.privacySegmentation.enabled",

                    value: false,

                  },

                },

                navigate: true,

              },

            },

          },

        },

        {

          id: "UPGRADE_GRATITUDE",

          content: {