Update strings and add new image.

mozilla · Nov 21, 2019 · c0a1c37 · c0a1c37
1 parent 62d93ed
commit c0a1c37
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 5 deletions.
diff --git a/public/css/app.css b/public/css/app.css
@@ -145,8 +145,8 @@ h3,
   line-height: 1.14;
 }
 
-.mw-400 {
-  max-width: 400px;
+.mw-360 {
+  max-width: 360px;
 }
 
 .mw-500 {

diff --git a/public/css/scan-results.css b/public/css/scan-results.css
@@ -77,10 +77,22 @@
   margin-bottom: calc(var(--padding) * 1.25);
 }
 
+.temp-marketing-img {
+  max-width: 320px;
+}
+
 .temp-marketing-hl {
-  color: var(--purple7);
-  font-size: 32px;
+  color: #20123a;
+  font-size: 24px;
   line-height: 1.13;
+  margin-bottom: 4px;
+}
+
+.temp-marketing-p {
+  color: var(--grey8);
+  line-height: 1.5;
+  margin: 0 auto 16px auto;
+  font-size: 18px;
 }
 
 .temp-marketing-alert-me-link {

diff --git a/public/img/svg/stay-alert.svg b/public/img/svg/stay-alert.svg
diff --git a/views/scan.hbs b/views/scan.hbs
@@ -43,7 +43,9 @@
 <section>
   {{#if newScanPage}} <!-- New trial UI for testing call to actions -->
     <div class="row txt-cntr jst-cntr flx-col temp-marketing-callout">
-      <h2 class="temp-marketing-hl mw-400">{{ getString "sign-up-headline-1" }}</h2>
+      <img class="temp-marketing-img" src="img/svg/stay-alert.svg" alt="" />
+      <h2 class="temp-marketing-hl mw-360">{{ getString "stay-alert" }}</h2>
+      <p class="temp-marketing-p mw-360">{{ getString "if-your-info" }}</p>
         <!--  
           the `data-event-category` attribute for this button is "Alert me about new breaches - Banner" 
           to match the "Alert me.." button on the other version of the scan results page and to make comparisons