Merge pull request #2699 from Safelite/CASH-1163-afterpay-update

CASH-1163 update Afterpay and code cleanup.

src/layouts/quote/afterpay-modal-banner/afterpay-modal-banner.vue

@@ -6,9 +6,13 @@
             async></component>
 
         <div>
-            <span v-for="token in headerCopyTokens" :key="token" v-html="token"></span>
+            <span
+                class="callout"
+                v-for="token in headerCopyTokens"
+                :key="token"
+                v-html="token"></span>
         </div>
-        <div :id="showAfterpayExtendedPayOption ? 'extended-pay-option' : ''">
+        <div>
             <span v-for="token in afterpayCopyTokens" :key="token">
                 <span v-if="isAfterpayPriceToken(token)">{{ afterpayPrice }}</span>
                 <span v-else-if="isInlineImageToken(token)">
@@ -78,15 +82,7 @@ export default {
             return splitCMSCopyOnBR(this.getCmsContent(this.cmsWidgetName, "HeaderText"));
         },
         afterpayCopyTokens() {
-            if (this.showAfterpayExtendedPayOption) {
-                return splitCopyOnCMSPlaceHolder(
-                    this.getCmsContent(this.cmsWidgetName, "BodyText")
-                );
-            } else {
-                return splitCopyOnCMSPlaceHolder(
-                    this.getCmsContent(this.cmsWidgetName, "BodyText2")
-                );
-            }
+            return splitCopyOnCMSPlaceHolder(this.getCmsContent(this.cmsWidgetName, "BodyText"));
         },
         modalCopy() {
             return this.getCmsContent(this.cmsWidgetName, "FooterText");
@@ -114,12 +110,6 @@ export default {
 
             return price;
         },
-        showAfterpayExtendedPayOption() {
-            return (
-                this.afterpayExtendedPayOptionThreshold &&
-                this.getTierOnePackagePrice >= this.afterpayExtendedPayOptionThreshold
-            );
-        },
     },
     components: {},
 };
@@ -138,11 +128,17 @@ export default {
         flex-direction: row;
     }
 
+    .callout {
+        font-family:
+            UrbanistSemibold Arial,
+            Helvetica,
+            sans-serif;
+    }
+
     > div:first-of-type {
         display: flex;
         color: $black;
         font-size: $font-size-20;
-        font-weight: $font-weight-600;
         line-height: 2rem;
         @include media-breakpoint-down(md) {
             border-bottom: 1px solid;
@@ -170,7 +166,7 @@ export default {
         }
         @include media-breakpoint-up(md) {
             padding-left: 1rem;
-            max-width: 26rem;
+            max-width: 32rem;
         }
     }