diff --git a/src/layouts/coverage-statement/afterpay-modal-banner/afterpay-modal-banner.vue b/src/layouts/coverage-statement/afterpay-modal-banner/afterpay-modal-banner.vue
index 54ecc441..a56de829 100644
--- a/src/layouts/coverage-statement/afterpay-modal-banner/afterpay-modal-banner.vue
+++ b/src/layouts/coverage-statement/afterpay-modal-banner/afterpay-modal-banner.vue
@@ -3,20 +3,20 @@
src="https://js.squarecdn.com/square-marketplace.js"
- async>
+ async>
+
-
-
{{ afterpayPaymentAmount }}
-
+
+
{{ afterpayPaymentAmount }}
+
![]()
-
.
+
.
Learn more
+ class="afterpay-learn-more">Learn more
@@ -72,10 +72,10 @@ export default {
imageUrl() {
return this.getCmsContent(this.cmsWidgetName, widgetFields.CONTENT_GROUP_WIDGET.IMAGE);
},
- afterpayHeaderCopy() {
+ afterpayCopy() {
return this.getCmsContent(this.cmsWidgetName, widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT);
},
- afterpaySubheaderCopy() {
+ afterpayCopyTwo() {
return this.getCmsContent(this.cmsWidgetName, widgetFields.CONTENT_GROUP_WIDGET.SUBHEADER_TEXT);
},
modalName() {
@@ -114,33 +114,32 @@ export default {
}
.afterpay-content {
- display: flex;
- flex-direction: column;
+ display: block;
+ text-align: center;
}
.afterpay-copy {
font-size: 0.875rem;
color: $blue-700;
font-weight: $font-weight-bold;
- text-align: center;
- flex-direction: column;
}
.image-and-link {
- display: flex;
justify-content: center;
align-items: center;
}
.image {
- flex-direction: column;
border: 0;
+ height: 20px;
+ width: 83px;
}
-:deep(a.learn-more-link) {
+:deep(a.afterpay-learn-more) {
color: $blue-700;
fill: $blue-700;
text-decoration: underline;
+ font-size: 0.875rem;
}
.afterpay-modal {