Merge branch 'develop' into feature/SSR-1634
This commit is contained in:
Katie Kroell
commit
9192bb6690
26 changed files with 1686 additions and 337 deletions
20
package-lock.json
generated
20
package-lock.json
generated
|
|
@ -6710,9 +6710,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/cookie": {
|
||||
"version": "0.6.0",
|
||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.6.0.tgz",
|
||||
"integrity": "sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==",
|
||||
"version": "0.7.1",
|
||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.1.tgz",
|
||||
"integrity": "sha512-6DnInpx7SJ2AK3+CTUE/ZM0vWTUboZCegxhC2xiIydHR9jNuTAASBrfEpHhiGOZw/nX51bHt6YQl8jsGo4y/0w==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">= 0.6"
|
||||
|
|
@ -8767,9 +8767,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/express": {
|
||||
"version": "4.21.0",
|
||||
"resolved": "https://registry.npmjs.org/express/-/express-4.21.0.tgz",
|
||||
"integrity": "sha512-VqcNGcj/Id5ZT1LZ/cfihi3ttTn+NJmkli2eZADigjq29qTlWi/hAQ43t/VLPq8+UX06FCEx3ByOYet6ZFblng==",
|
||||
"version": "4.21.1",
|
||||
"resolved": "https://registry.npmjs.org/express/-/express-4.21.1.tgz",
|
||||
"integrity": "sha512-YSFlK1Ee0/GC8QaO91tHcDxJiE/X4FbpAyQWkxAvG6AXCuR65YzK8ua6D9hvi/TzUfZMpc+BwuM1IPw8fmQBiQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"accepts": "~1.3.8",
|
||||
|
|
@ -8777,7 +8777,7 @@
|
|||
"body-parser": "1.20.3",
|
||||
"content-disposition": "0.5.4",
|
||||
"content-type": "~1.0.4",
|
||||
"cookie": "0.6.0",
|
||||
"cookie": "0.7.1",
|
||||
"cookie-signature": "1.0.6",
|
||||
"debug": "2.6.9",
|
||||
"depd": "2.0.0",
|
||||
|
|
@ -9714,9 +9714,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/http-proxy-middleware": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-2.0.6.tgz",
|
||||
"integrity": "sha512-ya/UeJ6HVBYxrgYotAZo1KvPWlgB48kUJLDePFeneHsVujFaW5WNj2NgWCAE//B1Dl02BIfYlpNgBy8Kf8Rjmw==",
|
||||
"version": "2.0.7",
|
||||
"resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-2.0.7.tgz",
|
||||
"integrity": "sha512-fgVY8AV7qU7z/MmXJ/rxwbrtQH4jBQ9m7kp3llF0liB7glmFeVZFBepQb32T3y8n8k2+AEYuMPCpinYW+/CuRA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/http-proxy": "^1.17.8",
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ body span {
|
|||
line-height: 24px;
|
||||
}
|
||||
body a {
|
||||
color: #1574A1;
|
||||
color: #0070D1;
|
||||
text-decoration: none;
|
||||
}
|
||||
body .form-group {
|
||||
|
|
@ -41,7 +41,7 @@ body select {
|
|||
}
|
||||
body input,
|
||||
body select {
|
||||
border-radius: 8px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #8E9292;
|
||||
padding: 16px;
|
||||
font-size: 16px;
|
||||
|
|
@ -73,7 +73,7 @@ body select:hover {
|
|||
box-shadow: 0 0 0 4px #9fcee6;
|
||||
}
|
||||
body select {
|
||||
border-radius: 8px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #8E9292;
|
||||
padding: 16px;
|
||||
width: 100%;
|
||||
|
|
@ -128,17 +128,6 @@ body .optional-label:after {
|
|||
}
|
||||
body .buttonContainer {
|
||||
height: 48px;
|
||||
position: relative;
|
||||
}
|
||||
body .buttonContainer:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
pointer-events: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
body .buttonContainer button {
|
||||
position: relative;
|
||||
|
|
@ -154,6 +143,7 @@ body .buttonContainer button {
|
|||
@media (hover: hover) {
|
||||
body .buttonContainer button {
|
||||
background: linear-gradient(270deg, #1574a1 0%, #003d58 100%);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
body .buttonContainer button:focus {
|
||||
|
|
@ -173,6 +163,7 @@ body .buttonContainer button:disabled {
|
|||
height: 48px;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
pointer-events: all;
|
||||
}
|
||||
body .buttonContainer button.has-loader {
|
||||
|
|
@ -213,3 +204,125 @@ body .cc-error-container #alert-message {
|
|||
background-color: #fcbfbb;
|
||||
border: 1px solid #d4281c;
|
||||
}
|
||||
|
||||
#fmg-checkout-shared .form-group .list-group.radio .list-group-item {
|
||||
border-radius: 5px;
|
||||
}
|
||||
#fmg-checkout-shared .form-group .list-group.radio .list-group-item label {
|
||||
padding: 12px 20px;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container {
|
||||
display: inline-flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container #paypalParentDiv {
|
||||
padding-left: 10px;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group .list-group.paymentSelection #applepayParentLink {
|
||||
margin: 0;
|
||||
padding: 10px 0;
|
||||
background-color: #000000;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group .list-group.paymentSelection #applepayParentLink label {
|
||||
padding: 0;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group .list-group.paymentSelection #applepayParentLink label apple-pay-button {
|
||||
vertical-align: middle;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group .list-group.paymentSelection #applepayParentLink.list-group-item {
|
||||
box-shadow: none;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #8E9292;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group .list-group.paymentSelection #applepayParentLink:host {
|
||||
--apple-pay-button-width: auto;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group .list-group #paypalParentLink {
|
||||
margin: 0;
|
||||
padding: 2px 0;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group .list-group #paypalParentLink #paypalImage {
|
||||
max-width: 50%;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container .form-group .list-group #paypalParentLink.list-group-item {
|
||||
box-shadow: none;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #8E9292;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container.no-applepay .form-group {
|
||||
width: 100%;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container.no-applepay .form-group#applepayParentDiv {
|
||||
display: none;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container.no-applepay .form-group#paypalParentDiv {
|
||||
padding-left: 0;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container.no-applepay .form-group .list-group.paymentSelection {
|
||||
width: 100%;
|
||||
}
|
||||
#fmg-checkout-shared #applepay-and-paypal-container.no-applepay .form-group .list-group #paypalParentLink #paypalImage {
|
||||
max-width: 25%;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container label {
|
||||
display: inline-flex;
|
||||
text-align: left;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container label span.paymentOptionText {
|
||||
margin: auto 0;
|
||||
padding-left: 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container #afterpayParentLink label > span:first-of-type {
|
||||
width: 100%;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container #afterpayParentLink label > span:last-of-type {
|
||||
width: 0;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container #creditCardParentDiv.active {
|
||||
margin-bottom: 32px;
|
||||
border: 1px solid #0070D1;
|
||||
border-radius: 10px;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container #creditCardParentDiv.active > .paymentSelection #creditCardParentLink {
|
||||
border-width: 0 0 2px 0;
|
||||
border-bottom-color: #0070D1;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container #creditCardParentDiv .paymentSelection #creditCardImages {
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container #creditCardParentDiv .paymentSelection #creditCardImages > img {
|
||||
width: 20%;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container #creditCardParentDiv .creditCardSpecific {
|
||||
padding: 0 16px;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container #creditCardParentDiv .creditCardSpecific > .form-group {
|
||||
width: 100%;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container .italicSmall {
|
||||
margin-top: 10px;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container .disclaimerContainerv2 {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
@media only screen and (max-device-width: 767px) {
|
||||
#fmg-checkout-shared #applepay-and-paypal-container {
|
||||
width: 100%;
|
||||
}
|
||||
#fmg-checkout-shared #other-payments-container > .form-group {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -112,3 +112,401 @@
|
|||
.creditCardSpecific {
|
||||
display: none;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.form-group.radio .list-group .list-group-item {
|
||||
border-radius: 22px;
|
||||
text-align: center;
|
||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.form-group.radio .list-group .list-group-item .radio .list-group,
|
||||
.form-group.radio .list-group .list-group-item .radio.list-group {
|
||||
margin: 0 0 22px 0;
|
||||
}
|
||||
|
||||
.form-group.radio .list-group .list-group-item > label {
|
||||
padding: 10px 32px 10px 32px;
|
||||
}
|
||||
|
||||
.form-group.radio .list-group .list-group-item .checkbox .list-group .list-group-item label,
|
||||
.form-group.radio .list-group .list-group-item .radio .list-group .list-group-item label,
|
||||
.form-group.radio .list-group .list-group-item .checkbox.list-group .list-group-item label,
|
||||
.form-group.radio .list-group .list-group-item .radio.list-group .list-group-item label {
|
||||
padding-left: 55px;
|
||||
}
|
||||
|
||||
.list-group.radio .list-group-item {
|
||||
border-radius: 22px;
|
||||
text-align: center;
|
||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.list-group.radio .list-group-item .radio .list-group,
|
||||
.list-group.radio .list-group-item .radio.list-group {
|
||||
margin: 0 0 22px 0;
|
||||
}
|
||||
|
||||
.list-group.radio .list-group-item > label {
|
||||
padding: 10px 32px 10px 32px;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.list-group.radio .list-group-item > label {
|
||||
padding: 12px 20px 12px 20px;
|
||||
}
|
||||
}
|
||||
html .list-group .list-group-item .list-group.radio .list-group-item {
|
||||
text-align: left;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
html .list-group .list-group-item .list-group.radio .list-group-item input[type=radio] {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
html .in-shop.vspacing .list-group.radio.vspacing .list-group-item {
|
||||
border-radius: 48px;
|
||||
}
|
||||
|
||||
.row > .form-group > .glyphicon {
|
||||
right: 15px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.form-group .control-label {
|
||||
display: block;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.form-group .form-control {
|
||||
margin-bottom: 2px;
|
||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
@media (min-width: 500px) {
|
||||
.form-group {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 800px) {
|
||||
.form-group {
|
||||
width: 60%;
|
||||
}
|
||||
}
|
||||
.list-group {
|
||||
margin-bottom: 20px;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 10px 15px;
|
||||
margin-bottom: -1px;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
|
||||
.list-group-item:first-child {
|
||||
border-top-right-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
}
|
||||
|
||||
.list-group-item:last-child {
|
||||
margin-bottom: 0;
|
||||
border-bottom-right-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
}
|
||||
|
||||
a.list-group-item {
|
||||
color: #555555;
|
||||
}
|
||||
|
||||
a.list-group-item .list-group-item-heading {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
a.list-group-item:hover,
|
||||
a.list-group-item:focus {
|
||||
text-decoration: none;
|
||||
color: #555555;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.list-group-item.disabled,
|
||||
.list-group-item.disabled:hover,
|
||||
.list-group-item.disabled:focus {
|
||||
background-color: #f0f1f2;
|
||||
color: #9aa1a3;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.list-group-item.disabled .list-group-item-heading,
|
||||
.list-group-item.disabled:hover .list-group-item-heading,
|
||||
.list-group-item.disabled:focus .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.list-group-item.disabled .list-group-item-text,
|
||||
.list-group-item.disabled:hover .list-group-item-text,
|
||||
.list-group-item.disabled:focus .list-group-item-text {
|
||||
color: #9aa1a3;
|
||||
}
|
||||
|
||||
.list-group-item.active,
|
||||
.list-group-item.active:hover,
|
||||
.list-group-item.active:focus {
|
||||
z-index: 2;
|
||||
color: #ffffff;
|
||||
background-color: #167cac;
|
||||
border-color: #167cac;
|
||||
}
|
||||
|
||||
.list-group-item.active .list-group-item-heading,
|
||||
.list-group-item.active:hover .list-group-item-heading,
|
||||
.list-group-item.active:focus .list-group-item-heading,
|
||||
.list-group-item.active .list-group-item-heading > small,
|
||||
.list-group-item.active:hover .list-group-item-heading > small,
|
||||
.list-group-item.active:focus .list-group-item-heading > small,
|
||||
.list-group-item.active .list-group-item-heading > .small,
|
||||
.list-group-item.active:hover .list-group-item-heading > .small,
|
||||
.list-group-item.active:focus .list-group-item-heading > .small {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.list-group-item.active .list-group-item-text,
|
||||
.list-group-item.active:hover .list-group-item-text,
|
||||
.list-group-item.active:focus .list-group-item-text {
|
||||
color: #9cd7f2;
|
||||
}
|
||||
|
||||
.list-group-item-success {
|
||||
color: #cacbcc;
|
||||
background-color: #e6f2ec;
|
||||
}
|
||||
|
||||
a.list-group-item-success {
|
||||
color: #cacbcc;
|
||||
}
|
||||
|
||||
a.list-group-item-success .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
a.list-group-item-success:hover,
|
||||
a.list-group-item-success:focus {
|
||||
color: #cacbcc;
|
||||
background-color: #d5e9df;
|
||||
}
|
||||
|
||||
a.list-group-item-success.active,
|
||||
a.list-group-item-success.active:hover,
|
||||
a.list-group-item-success.active:focus {
|
||||
color: #fff;
|
||||
background-color: #cacbcc;
|
||||
border-color: #cacbcc;
|
||||
}
|
||||
|
||||
.list-group-item-info {
|
||||
color: #125b7e;
|
||||
background-color: #e7f1f6;
|
||||
}
|
||||
|
||||
a.list-group-item-info {
|
||||
color: #125b7e;
|
||||
}
|
||||
|
||||
a.list-group-item-info .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
a.list-group-item-info:hover,
|
||||
a.list-group-item-info:focus {
|
||||
color: #125b7e;
|
||||
background-color: #d4e6ef;
|
||||
}
|
||||
|
||||
a.list-group-item-info.active,
|
||||
a.list-group-item-info.active:hover,
|
||||
a.list-group-item-info.active:focus {
|
||||
color: #fff;
|
||||
background-color: #125b7e;
|
||||
border-color: #125b7e;
|
||||
}
|
||||
|
||||
.list-group-item-warning {
|
||||
color: #f8af1c;
|
||||
background-color: #fef6e8;
|
||||
}
|
||||
|
||||
a.list-group-item-warning {
|
||||
color: #f8af1c;
|
||||
}
|
||||
|
||||
a.list-group-item-warning .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
a.list-group-item-warning:hover,
|
||||
a.list-group-item-warning:focus {
|
||||
color: #f8af1c;
|
||||
background-color: #fdecd0;
|
||||
}
|
||||
|
||||
a.list-group-item-warning.active,
|
||||
a.list-group-item-warning.active:hover,
|
||||
a.list-group-item-warning.active:focus {
|
||||
color: #fff;
|
||||
background-color: #f8af1c;
|
||||
border-color: #f8af1c;
|
||||
}
|
||||
|
||||
.list-group-item-danger {
|
||||
color: #da291c;
|
||||
background-color: #fbe9e8;
|
||||
}
|
||||
|
||||
a.list-group-item-danger {
|
||||
color: #da291c;
|
||||
}
|
||||
|
||||
a.list-group-item-danger .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
a.list-group-item-danger:hover,
|
||||
a.list-group-item-danger:focus {
|
||||
color: #da291c;
|
||||
background-color: #f7d4d2;
|
||||
}
|
||||
|
||||
a.list-group-item-danger.active,
|
||||
a.list-group-item-danger.active:hover,
|
||||
a.list-group-item-danger.active:focus {
|
||||
color: #fff;
|
||||
background-color: #da291c;
|
||||
border-color: #da291c;
|
||||
}
|
||||
|
||||
.list-group-item-heading {
|
||||
margin-top: 0;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.list-group-item-text {
|
||||
margin-bottom: 0;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.radio .list-group.paymentSelection, .radio.list-group.paymentSelection {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
@media (max-width: 33.9em) {
|
||||
.radio .list-group.paymentSelection label, .radio .list-group.paymentSelection a, .radio.list-group.paymentSelection label, .radio.list-group.paymentSelection a {
|
||||
max-height: 52px;
|
||||
}
|
||||
}
|
||||
|
||||
.radio,
|
||||
.checkbox,
|
||||
.form-group.checkbox .list-group,
|
||||
.form-group.checkbox .list-group,
|
||||
.form-group.radio .list-group,
|
||||
.form-group.radio .list-group,
|
||||
.checkbox.list-group,
|
||||
.checkbox.list-group,
|
||||
.radio.list-group,
|
||||
.radio.list-group {
|
||||
position: relative;
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.form-group.checkbox .list-group .list-group-item > label,
|
||||
.form-group.radio .list-group .list-group-item > label,
|
||||
.checkbox.list-group .list-group-item > label,
|
||||
.radio.list-group .list-group-item > label {
|
||||
margin-bottom: initial;
|
||||
width: 100%;
|
||||
font-weight: normal;
|
||||
padding: 12px 27px 12px 33px;
|
||||
color: #525656;
|
||||
}
|
||||
|
||||
.form-group.checkbox .list-group .list-group-item,
|
||||
.form-group.radio .list-group .list-group-item,
|
||||
.checkbox.list-group .list-group-item,
|
||||
.radio.list-group .list-group-item {
|
||||
margin-bottom: 12px;
|
||||
border-width: 1px;
|
||||
/* border-color: #cacbcc; */
|
||||
border-radius: 5px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.form-group.checkbox .list-group .list-group-item.active,
|
||||
.form-group.radio .list-group .list-group-item.active,
|
||||
.checkbox.list-group .list-group-item.active,
|
||||
.radio.list-group .list-group-item.active {
|
||||
background-color: #e7f1f6;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.radio label,
|
||||
.checkbox label {
|
||||
min-height: 23px;
|
||||
padding-left: 20px;
|
||||
margin-bottom: 0;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
color: #525656;
|
||||
}
|
||||
|
||||
img {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#paypalParentLink label,
|
||||
#afterpayParentLink label,
|
||||
#creditCardParentLink label {
|
||||
padding-top: 9px;
|
||||
padding-bottom: 9px;
|
||||
}
|
||||
|
||||
#paypalParentLink label .paymentOptionText,
|
||||
#creditCardParentLink label .paymentOptionText {
|
||||
padding-left: 20px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
html #creditCardParentLink.list-group-item {
|
||||
border-radius: 48px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.list-group.radio .list-group-item > label {
|
||||
padding: 12px 20px 12px 20px;
|
||||
}
|
||||
}
|
||||
label {
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
margin-bottom: 5px;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ body {
|
|||
}
|
||||
|
||||
a {
|
||||
color: #1574A1;
|
||||
color: #0070D1;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
|
@ -50,7 +50,7 @@ body {
|
|||
|
||||
input,
|
||||
select {
|
||||
border-radius: 8px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #8E9292;
|
||||
padding: 16px;
|
||||
font-size: 16px;
|
||||
|
|
@ -78,7 +78,7 @@ body {
|
|||
}
|
||||
|
||||
select {
|
||||
border-radius: 8px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #8E9292;
|
||||
padding: 16px;
|
||||
width: 100%;
|
||||
|
|
@ -139,17 +139,6 @@ body {
|
|||
|
||||
.buttonContainer {
|
||||
height: 48px;
|
||||
position: relative;
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
pointer-events: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
button {
|
||||
position: relative;
|
||||
background: linear-gradient(270deg, #1574a1 0%, #003d58 100%);
|
||||
|
|
@ -162,6 +151,7 @@ body {
|
|||
height: 48px;
|
||||
@media (hover: hover) {
|
||||
background: linear-gradient(270deg, #1574a1 0%, #003d58 100%);
|
||||
cursor: pointer;
|
||||
}
|
||||
&:focus {
|
||||
box-shadow: 0 0 0 3px, 0 0 0 5.5px #06577c;
|
||||
|
|
@ -182,6 +172,7 @@ body {
|
|||
height: 48px;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
pointer-events: all;
|
||||
}
|
||||
&.has-loader {
|
||||
|
|
@ -230,5 +221,199 @@ body {
|
|||
border: 1px solid #d4281c;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#fmg-checkout-shared {
|
||||
.form-group {
|
||||
.list-group {
|
||||
&.radio {
|
||||
.list-group-item {
|
||||
border-radius: 5px;
|
||||
|
||||
label {
|
||||
padding: 12px 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#applepay-and-paypal-container {
|
||||
display: inline-flex;
|
||||
width: 100%;
|
||||
|
||||
justify-content: space-between;
|
||||
|
||||
#paypalParentDiv {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
.list-group {
|
||||
&.paymentSelection {
|
||||
|
||||
#applepayParentLink {
|
||||
|
||||
margin: 0;
|
||||
padding: 10px 0;
|
||||
background-color: #000000;
|
||||
|
||||
label {
|
||||
padding: 0;
|
||||
|
||||
apple-pay-button {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
&.list-group-item {
|
||||
box-shadow: none;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #8E9292;
|
||||
}
|
||||
|
||||
&:host {
|
||||
--apple-pay-button-width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#paypalParentLink {
|
||||
margin: 0;
|
||||
padding: 2px 0;
|
||||
|
||||
#paypalImage {
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
&.list-group-item {
|
||||
box-shadow: none;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #8E9292;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.no-applepay {
|
||||
.form-group {
|
||||
width: 100%;
|
||||
|
||||
&#applepayParentDiv {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&#paypalParentDiv {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.list-group {
|
||||
&.paymentSelection {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#paypalParentLink {
|
||||
|
||||
#paypalImage {
|
||||
max-width: 25%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#other-payments-container {
|
||||
label {
|
||||
display: inline-flex;
|
||||
text-align: left;
|
||||
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
|
||||
span {
|
||||
&.paymentOptionText {
|
||||
margin: auto 0;
|
||||
padding-left: 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#afterpayParentLink {
|
||||
label {
|
||||
> span {
|
||||
&:first-of-type {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&:last-of-type {
|
||||
width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#creditCardParentDiv {
|
||||
&.active {
|
||||
margin-bottom: 32px;
|
||||
border: 1px solid #0070D1;
|
||||
border-radius: 10px;
|
||||
|
||||
> .paymentSelection {
|
||||
#creditCardParentLink {
|
||||
border-width: 0 0 2px 0;
|
||||
border-bottom-color: #0070D1;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.paymentSelection {
|
||||
#creditCardImages {
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
|
||||
> img {
|
||||
width: 20%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.creditCardSpecific {
|
||||
padding: 0 16px;
|
||||
|
||||
> .form-group {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.italicSmall {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.disclaimerContainerv2 {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-device-width: 767px) {
|
||||
#applepay-and-paypal-container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#other-payments-container {
|
||||
> .form-group {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -116,3 +116,361 @@
|
|||
.creditCardSpecific {
|
||||
display: none;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.form-group.radio .list-group .list-group-item {
|
||||
border-radius: 22px;
|
||||
text-align: center;
|
||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.form-group.radio .list-group .list-group-item .radio .list-group,
|
||||
.form-group.radio .list-group .list-group-item .radio.list-group {
|
||||
margin: 0 0 22px 0;
|
||||
}
|
||||
.form-group.radio .list-group .list-group-item > label {
|
||||
padding: 10px 32px 10px 32px;
|
||||
}
|
||||
.form-group.radio .list-group .list-group-item .checkbox .list-group .list-group-item label,
|
||||
.form-group.radio .list-group .list-group-item .radio .list-group .list-group-item label,
|
||||
.form-group.radio .list-group .list-group-item .checkbox.list-group .list-group-item label,
|
||||
.form-group.radio .list-group .list-group-item .radio.list-group .list-group-item label {
|
||||
padding-left: 55px;
|
||||
}
|
||||
.list-group.radio .list-group-item {
|
||||
border-radius: 22px;
|
||||
text-align: center;
|
||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.list-group.radio .list-group-item .radio .list-group,
|
||||
.list-group.radio .list-group-item .radio.list-group {
|
||||
margin: 0 0 22px 0;
|
||||
}
|
||||
.list-group.radio .list-group-item > label {
|
||||
padding: 10px 32px 10px 32px;
|
||||
}
|
||||
@media (max-width: 992px) {
|
||||
.list-group.radio .list-group-item > label {
|
||||
padding: 12px 20px 12px 20px;
|
||||
}
|
||||
}
|
||||
html .list-group .list-group-item .list-group.radio .list-group-item {
|
||||
text-align: left;
|
||||
border-radius: 0;
|
||||
}
|
||||
html .list-group .list-group-item .list-group.radio .list-group-item input[type="radio"] {
|
||||
visibility: visible;
|
||||
}
|
||||
html .in-shop.vspacing .list-group.radio.vspacing .list-group-item {
|
||||
border-radius: 48px;
|
||||
}
|
||||
.row > .form-group > .glyphicon {
|
||||
right: 15px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.form-group .control-label {
|
||||
display: block;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.form-group .form-control {
|
||||
margin-bottom: 2px;
|
||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
@media (min-width: 500px) {
|
||||
.form-group {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 800px) {
|
||||
.form-group {
|
||||
width: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
.list-group {
|
||||
margin-bottom: 20px;
|
||||
padding-left: 0;
|
||||
}
|
||||
.list-group-item {
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 10px 15px;
|
||||
margin-bottom: -1px;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
.list-group-item:first-child {
|
||||
border-top-right-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
}
|
||||
.list-group-item:last-child {
|
||||
margin-bottom: 0;
|
||||
border-bottom-right-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
}
|
||||
a.list-group-item {
|
||||
color: #555555;
|
||||
}
|
||||
a.list-group-item .list-group-item-heading {
|
||||
color: #333333;
|
||||
}
|
||||
a.list-group-item:hover,
|
||||
a.list-group-item:focus {
|
||||
text-decoration: none;
|
||||
color: #555555;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.list-group-item.disabled,
|
||||
.list-group-item.disabled:hover,
|
||||
.list-group-item.disabled:focus {
|
||||
background-color: #f0f1f2;
|
||||
color: #9aa1a3;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.list-group-item.disabled .list-group-item-heading,
|
||||
.list-group-item.disabled:hover .list-group-item-heading,
|
||||
.list-group-item.disabled:focus .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
.list-group-item.disabled .list-group-item-text,
|
||||
.list-group-item.disabled:hover .list-group-item-text,
|
||||
.list-group-item.disabled:focus .list-group-item-text {
|
||||
color: #9aa1a3;
|
||||
}
|
||||
.list-group-item.active,
|
||||
.list-group-item.active:hover,
|
||||
.list-group-item.active:focus {
|
||||
z-index: 2;
|
||||
color: #ffffff;
|
||||
background-color: #167cac;
|
||||
border-color: #167cac;
|
||||
}
|
||||
.list-group-item.active .list-group-item-heading,
|
||||
.list-group-item.active:hover .list-group-item-heading,
|
||||
.list-group-item.active:focus .list-group-item-heading,
|
||||
.list-group-item.active .list-group-item-heading > small,
|
||||
.list-group-item.active:hover .list-group-item-heading > small,
|
||||
.list-group-item.active:focus .list-group-item-heading > small,
|
||||
.list-group-item.active .list-group-item-heading > .small,
|
||||
.list-group-item.active:hover .list-group-item-heading > .small,
|
||||
.list-group-item.active:focus .list-group-item-heading > .small {
|
||||
color: inherit;
|
||||
}
|
||||
.list-group-item.active .list-group-item-text,
|
||||
.list-group-item.active:hover .list-group-item-text,
|
||||
.list-group-item.active:focus .list-group-item-text {
|
||||
color: #9cd7f2;
|
||||
}
|
||||
.list-group-item-success {
|
||||
color: #cacbcc;
|
||||
background-color: #e6f2ec;
|
||||
}
|
||||
a.list-group-item-success {
|
||||
color: #cacbcc;
|
||||
}
|
||||
a.list-group-item-success .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
a.list-group-item-success:hover,
|
||||
a.list-group-item-success:focus {
|
||||
color: #cacbcc;
|
||||
background-color: #d5e9df;
|
||||
}
|
||||
a.list-group-item-success.active,
|
||||
a.list-group-item-success.active:hover,
|
||||
a.list-group-item-success.active:focus {
|
||||
color: #fff;
|
||||
background-color: #cacbcc;
|
||||
border-color: #cacbcc;
|
||||
}
|
||||
.list-group-item-info {
|
||||
color: #125b7e;
|
||||
background-color: #e7f1f6;
|
||||
}
|
||||
a.list-group-item-info {
|
||||
color: #125b7e;
|
||||
}
|
||||
a.list-group-item-info .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
a.list-group-item-info:hover,
|
||||
a.list-group-item-info:focus {
|
||||
color: #125b7e;
|
||||
background-color: #d4e6ef;
|
||||
}
|
||||
a.list-group-item-info.active,
|
||||
a.list-group-item-info.active:hover,
|
||||
a.list-group-item-info.active:focus {
|
||||
color: #fff;
|
||||
background-color: #125b7e;
|
||||
border-color: #125b7e;
|
||||
}
|
||||
.list-group-item-warning {
|
||||
color: #f8af1c;
|
||||
background-color: #fef6e8;
|
||||
}
|
||||
a.list-group-item-warning {
|
||||
color: #f8af1c;
|
||||
}
|
||||
a.list-group-item-warning .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
a.list-group-item-warning:hover,
|
||||
a.list-group-item-warning:focus {
|
||||
color: #f8af1c;
|
||||
background-color: #fdecd0;
|
||||
}
|
||||
a.list-group-item-warning.active,
|
||||
a.list-group-item-warning.active:hover,
|
||||
a.list-group-item-warning.active:focus {
|
||||
color: #fff;
|
||||
background-color: #f8af1c;
|
||||
border-color: #f8af1c;
|
||||
}
|
||||
.list-group-item-danger {
|
||||
color: #da291c;
|
||||
background-color: #fbe9e8;
|
||||
}
|
||||
a.list-group-item-danger {
|
||||
color: #da291c;
|
||||
}
|
||||
a.list-group-item-danger .list-group-item-heading {
|
||||
color: inherit;
|
||||
}
|
||||
a.list-group-item-danger:hover,
|
||||
a.list-group-item-danger:focus {
|
||||
color: #da291c;
|
||||
background-color: #f7d4d2;
|
||||
}
|
||||
a.list-group-item-danger.active,
|
||||
a.list-group-item-danger.active:hover,
|
||||
a.list-group-item-danger.active:focus {
|
||||
color: #fff;
|
||||
background-color: #da291c;
|
||||
border-color: #da291c;
|
||||
}
|
||||
.list-group-item-heading {
|
||||
margin-top: 0;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.list-group-item-text {
|
||||
margin-bottom: 0;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
|
||||
.radio .list-group.paymentSelection, .radio.list-group.paymentSelection {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
|
||||
@media (max-width: 33.9em) {
|
||||
label, a {
|
||||
max-height: 52px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.radio,
|
||||
.checkbox,
|
||||
.form-group.checkbox .list-group,
|
||||
.form-group.checkbox .list-group,
|
||||
.form-group.radio .list-group,
|
||||
.form-group.radio .list-group,
|
||||
.checkbox.list-group,
|
||||
.checkbox.list-group,
|
||||
.radio.list-group,
|
||||
.radio.list-group {
|
||||
position: relative;
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.form-group.checkbox .list-group .list-group-item > label,
|
||||
.form-group.radio .list-group .list-group-item > label,
|
||||
.checkbox.list-group .list-group-item > label,
|
||||
.radio.list-group .list-group-item > label {
|
||||
margin-bottom: initial;
|
||||
width: 100%;
|
||||
font-weight: normal;
|
||||
padding: 12px 27px 12px 33px;
|
||||
color: #525656;
|
||||
}
|
||||
|
||||
.form-group.checkbox .list-group .list-group-item,
|
||||
.form-group.radio .list-group .list-group-item,
|
||||
.checkbox.list-group .list-group-item,
|
||||
.radio.list-group .list-group-item {
|
||||
margin-bottom: 12px;
|
||||
border-width: 1px;
|
||||
/* border-color: #cacbcc; */
|
||||
border-radius: 5px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.form-group.checkbox .list-group .list-group-item.active,
|
||||
.form-group.radio .list-group .list-group-item.active,
|
||||
.checkbox.list-group .list-group-item.active,
|
||||
.radio.list-group .list-group-item.active {
|
||||
background-color: #e7f1f6;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.radio label,
|
||||
.checkbox label {
|
||||
min-height: 23px;
|
||||
padding-left: 20px;
|
||||
margin-bottom: 0;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
color: #525656;
|
||||
}
|
||||
|
||||
img {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#paypalParentLink label,
|
||||
#afterpayParentLink label,
|
||||
#creditCardParentLink label {
|
||||
padding-top: 9px;
|
||||
padding-bottom: 9px;
|
||||
}
|
||||
|
||||
#paypalParentLink label .paymentOptionText,
|
||||
#creditCardParentLink label .paymentOptionText {
|
||||
padding-left: 20px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
html #creditCardParentLink.list-group-item {
|
||||
border-radius: 48px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.list-group.radio .list-group-item > label {
|
||||
padding: 12px 20px 12px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
margin-bottom: 5px;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
}
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
const partTypeStrings = Object.freeze({
|
||||
ADAS_RECALIBRATION: 'ADAS RECALIBRATION',
|
||||
WINDSHIELD: 'WINDSHIELD',
|
||||
FRONT_WIPER: 'FRONT WIPER',
|
||||
REAR_WIPER: 'REAR WIPER',
|
||||
|
|
|
|||
|
|
@ -1,15 +1,11 @@
|
|||
const hopPaymentMethods = Object.freeze({
|
||||
CREDIT_CARD: 'cc',
|
||||
PAYPAL: 'pp',
|
||||
AFTERPAY: 'ap'
|
||||
});
|
||||
|
||||
const paymentMethods = Object.freeze({
|
||||
NONE: null,
|
||||
PayNow: 'PayNow', // User selected the pay now and hasn't selected their payment method yet
|
||||
PAY_AT_TIME_OF_SERVICE: 'PayAtTimeOfService',
|
||||
CREDIT_CARD: 'CreditCard',
|
||||
PAYPAL: 'Paypal',
|
||||
AFTERPAY: 'Afterpay'
|
||||
AFTERPAY: 'Afterpay',
|
||||
APPLEPAY: 'ApplePay'
|
||||
});
|
||||
|
||||
export { hopPaymentMethods, paymentMethods };
|
||||
export { paymentMethods };
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@ export default {
|
|||
const headers = {
|
||||
[headerKeys.EXPERIMENT]: JSON.stringify(store.experimentSettings),
|
||||
[headerKeys.APPLICATION_NAME]: applicationConfig.APPLICATION_NAME,
|
||||
[headerKeys.TRANSACTION_ID]: store.order.referralCorrelationId,
|
||||
[headerKeys.TRANSACTION_ID]: crypto.randomUUID(),
|
||||
[headerKeys.ENTERPRISE_ORDER_NUMBER]: store.order.eon,
|
||||
[headerKeys.REFERRAL_SEQUENCE_NUMBER]: store.order.referralSequenceNumber,
|
||||
[headerKeys.SESSION_SEQUENCE_NUMBER]: sessionKey
|
||||
|
|
|
|||
|
|
@ -2,16 +2,19 @@ import axios from 'axios';
|
|||
import globalMethods from '@/global-methods';
|
||||
import analyticsMixIn from '@/mixins/analytics-mixin';
|
||||
import { getMountOptions } from '@/helpers/unit-test-helper.js';
|
||||
import crypto from 'crypto';
|
||||
|
||||
// Mock external dependencies
|
||||
jest.mock('axios');
|
||||
jest.mock('@/mixins/analytics-mixin');
|
||||
|
||||
global.crypto = crypto;
|
||||
|
||||
global.$logger = {
|
||||
logInformation: jest.fn(),
|
||||
logWarning: jest.fn(),
|
||||
logError: jest.fn(),
|
||||
logCritical: jest.fn(),
|
||||
logCritical: jest.fn()
|
||||
};
|
||||
|
||||
/** @ignore */
|
||||
|
|
|
|||
3
src/helpers/browser-helper.js
Normal file
3
src/helpers/browser-helper.js
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
export function supportsApplePay() {
|
||||
return !!(window.ApplePaySession && window.ApplePaySession.canMakePayments());
|
||||
}
|
||||
|
|
@ -71,7 +71,7 @@ export class Logger {
|
|||
const headers = {
|
||||
[headerKeys.EXPERIMENT]: JSON.stringify(store.experimentSettings),
|
||||
[headerKeys.APPLICATION_NAME]: applicationConfig.APPLICATION_NAME,
|
||||
[headerKeys.TRANSACTION_ID]: store.order.referralCorrelationId,
|
||||
[headerKeys.TRANSACTION_ID]: crypto.randomUUID(),
|
||||
[headerKeys.ENTERPRISE_ORDER_NUMBER]: store.order.eon,
|
||||
[headerKeys.REFERRAL_SEQUENCE_NUMBER]: store.order.referralSequenceNumber,
|
||||
[headerKeys.SESSION_SEQUENCE_NUMBER]: sessionKey
|
||||
|
|
|
|||
25
src/helpers/recal-helper.js
Normal file
25
src/helpers/recal-helper.js
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
import partTypeStrings from '@/constants/part-type-strings';
|
||||
|
||||
const recalPartTypes = [partTypeStrings.RECALIBRATION, partTypeStrings.ADAS_RECALIBRATION];
|
||||
|
||||
export function isRecalPart(part) {
|
||||
return recalPartTypes.some((type) => type === part.partType);
|
||||
}
|
||||
|
||||
export function isRecalPartOrHasChildRecalPart(glassPart) {
|
||||
const isGlassPartRecalPart = isRecalPart(glassPart);
|
||||
|
||||
if (!isGlassPartRecalPart && glassPart.childParts && glassPart.childParts.length > 0) {
|
||||
return glassPart.childParts.filter((cp) => isRecalPartOrHasChildRecalPart(cp));
|
||||
}
|
||||
|
||||
return isGlassPartRecalPart;
|
||||
}
|
||||
|
||||
export function getTopLevelGlassPartsWithRecal(glassParts) {
|
||||
if (!glassParts) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return glassParts.filter((gp) => isRecalPartOrHasChildRecalPart(gp));
|
||||
}
|
||||
|
|
@ -138,7 +138,7 @@ export default {
|
|||
}
|
||||
}
|
||||
#siteHeaderImage {
|
||||
width: 10rem;
|
||||
width: auto;
|
||||
height: 2.5rem;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -379,7 +379,7 @@ export default {
|
|||
async initializeComponent() {
|
||||
if (this.shouldRegisterClaim) {
|
||||
await this.mainStore.registerClaim();
|
||||
} else if (!this.mainStore.isClaimRegistrationRequired) {
|
||||
} else if (!this.mainStore.isClaimRegistrationRequired && this.mainStore.order.insuranceCoverage.coverageType !== coverageType.NONE) {
|
||||
this.mainStore.updateCoverageStatus(coverageStatuses.VERIFIED);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ import coverageStatuses from '@/constants/coverage-statuses';
|
|||
import coverageType from '@/constants/coverage-type';
|
||||
import { deepClone } from '@/helpers/object-helper';
|
||||
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
|
||||
import { paymentMethods } from "@/constants/payment-method-constants";
|
||||
|
||||
jest.mock('@/helpers/layout-helper.js', () => jest.fn());
|
||||
|
||||
|
|
@ -80,7 +81,7 @@ const initialStore = {
|
|||
},
|
||||
payment: {
|
||||
isInsurance: true,
|
||||
isPayInAdvance: false
|
||||
paymentMethod: paymentMethods.PAY_AT_TIME_OF_SERVICE
|
||||
},
|
||||
contactInfo: {
|
||||
firstName: 'Test',
|
||||
|
|
|
|||
|
|
@ -147,7 +147,7 @@ export default {
|
|||
return { mainStore, submittedOrder };
|
||||
},
|
||||
data() {
|
||||
var {
|
||||
const {
|
||||
vehicle,
|
||||
serviceLocation,
|
||||
schedule,
|
||||
|
|
@ -155,8 +155,9 @@ export default {
|
|||
payment,
|
||||
customerPortalLoginToken,
|
||||
damage,
|
||||
referralNumber } = this.submittedOrder;
|
||||
var { issConfig, hasRecalibrationPart } = this.mainStore;
|
||||
referralNumber
|
||||
} = this.submittedOrder;
|
||||
const { issConfig, hasRecalibrationPart } = this.mainStore;
|
||||
return {
|
||||
vehicle,
|
||||
customerEmail: customer?.emailAddress,
|
||||
|
|
@ -179,7 +180,7 @@ export default {
|
|||
mobile: 'MobileWordingWidget',
|
||||
dropOffAndInShop: 'DropOffAndInShopWordingWidget',
|
||||
siteFooter: 'SiteFooterWidget'
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -383,8 +384,7 @@ export default {
|
|||
);
|
||||
|
||||
// Payment
|
||||
const paymentMethodReqs =
|
||||
useMainStore().order.payment.isPayInAdvance === false;
|
||||
const paymentMethodReqs = useMainStore().order.payment.paymentMethod != null;
|
||||
|
||||
return (
|
||||
serviceLocationReqs
|
||||
|
|
|
|||
|
|
@ -72,8 +72,7 @@ describe('payment-method.vue', () => {
|
|||
const store = {
|
||||
order: {
|
||||
payment: {
|
||||
isPayInAdvance: false,
|
||||
payInAdvanceType: null
|
||||
paymentMethod: null
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
@ -91,8 +90,7 @@ describe('payment-method.vue', () => {
|
|||
const store = {
|
||||
order: {
|
||||
payment: {
|
||||
isPayInAdvance: true,
|
||||
payInAdvanceType: payInAdvanceMethod
|
||||
paymentMethod: payInAdvanceMethod
|
||||
},
|
||||
insuranceCoverage: {
|
||||
coverageStatus: coverageStatuses.VERIFIED,
|
||||
|
|
@ -115,8 +113,7 @@ describe('payment-method.vue', () => {
|
|||
const store = {
|
||||
order: {
|
||||
payment: {
|
||||
isPayInAdvance: true,
|
||||
payInAdvanceType: payInAdvanceMethod
|
||||
paymentMethod: payInAdvanceMethod
|
||||
},
|
||||
insuranceCoverage: {
|
||||
coverageStatus: coverageStatuses.VERIFIED,
|
||||
|
|
@ -139,8 +136,7 @@ describe('payment-method.vue', () => {
|
|||
const store = {
|
||||
order: {
|
||||
payment: {
|
||||
isPayInAdvance: true,
|
||||
payInAdvanceType: payInAdvanceMethod
|
||||
paymentMethod: payInAdvanceMethod
|
||||
},
|
||||
insuranceCoverage: {
|
||||
coverageStatus: coverageStatuses.PENDING,
|
||||
|
|
@ -173,8 +169,7 @@ describe('payment-method.vue', () => {
|
|||
const store = {
|
||||
order: {
|
||||
payment: {
|
||||
isPayInAdvance: true,
|
||||
payInAdvanceType: payInAdvanceMethod
|
||||
paymentMethod: payInAdvanceMethod
|
||||
},
|
||||
insuranceCoverage: {
|
||||
coverageStatus: coverageStatuses.VERIFIED,
|
||||
|
|
@ -327,8 +322,7 @@ describe('payment-method.vue', () => {
|
|||
const store = {
|
||||
order: {
|
||||
payment: {
|
||||
isPayInAdvance: false,
|
||||
payInAdvanceType: null
|
||||
paymentMethod: paymentMethods.PAY_AT_TIME_OF_SERVICE
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -43,8 +43,8 @@
|
|||
:isDismissible="false" />
|
||||
<paymentMethodQuestion
|
||||
v-if="!isPayInAdvanceDisabled"
|
||||
v-model="paymentMethodInternalModel"
|
||||
cmsWidgetName="PaymentMethodWidget"
|
||||
v-model="paymentMethod"
|
||||
:cmsWidgetName="paymentMethodWidgetName"
|
||||
:validationRules="rules.optionRequired" />
|
||||
<alert
|
||||
v-if="isPayInAdvanceDisabled"
|
||||
|
|
@ -93,6 +93,7 @@ import { saveSession, submitWorkOrder } from '@/helpers/order-helper.js';
|
|||
import { experimentSettings } from '@/constants/experiments';
|
||||
import submitType from '@/constants/submit-type';
|
||||
import routerParams from '@/router/router-constants/router-params';
|
||||
import { supportsApplePay } from '@/helpers/browser-helper';
|
||||
|
||||
export default {
|
||||
name: 'payment-method',
|
||||
|
|
@ -131,7 +132,11 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
paymentMethodInternalModel: this.getPaymentMethodFromStore(),
|
||||
paymentMethod: this.getPaymentMethodFromStore(),
|
||||
widget: {
|
||||
paymentMethod: 'PaymentMethodWidget',
|
||||
paymentMethodApplePay: 'PaymentMethodWidgetApplePay'
|
||||
},
|
||||
rules: {
|
||||
optionRequired: globalRules.OPTION_REQUIRED
|
||||
}
|
||||
|
|
@ -140,10 +145,8 @@ export default {
|
|||
computed: {
|
||||
customCallToActionButtonCopy() {
|
||||
switch (this.paymentMethod) {
|
||||
case paymentMethods.CREDIT_CARD:
|
||||
case paymentMethods.PayNow:
|
||||
return 'Continue to checkout';
|
||||
case paymentMethods.PAYPAL:
|
||||
return 'Continue to Paypal';
|
||||
case paymentMethods.AFTERPAY:
|
||||
return 'Continue to Afterpay';
|
||||
default:
|
||||
|
|
@ -160,8 +163,8 @@ export default {
|
|||
|
||||
return !isEnabled || useMainStore().isUnverified || (useMainStore().isDeductible && isDeductibleTotalEqualToZero);
|
||||
},
|
||||
paymentMethod() {
|
||||
return this.paymentMethodInternalModel;
|
||||
paymentMethodWidgetName() {
|
||||
return supportsApplePay() ? this.widget.paymentMethodApplePay : this.widget.paymentMethod;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
@ -252,22 +255,17 @@ export default {
|
|||
);
|
||||
},
|
||||
getPaymentMethodFromStore() {
|
||||
const { payInAdvanceType } = useMainStore().order.payment;
|
||||
const isPayInAdvance =
|
||||
useMainStore().order.payment.isPayInAdvance
|
||||
&& !!payInAdvanceType
|
||||
&& !this.isPayInAdvanceDisabled;
|
||||
if (this.isPayInAdvanceDisabled) {
|
||||
return paymentMethods.PAY_AT_TIME_OF_SERVICE;
|
||||
}
|
||||
|
||||
return isPayInAdvance
|
||||
? payInAdvanceType
|
||||
: paymentMethods.PAY_AT_TIME_OF_SERVICE;
|
||||
return useMainStore().order.payment.paymentMethod;
|
||||
},
|
||||
updateFooterButtonText(newValue) {
|
||||
this.$refs.siteFooter.updateButtonText(newValue);
|
||||
},
|
||||
async forwardButtonAction() {
|
||||
useMainStore().savePaymentMethodChoice(this.paymentMethod);
|
||||
|
||||
if (this.paymentMethod === paymentMethods.PAY_AT_TIME_OF_SERVICE) {
|
||||
try {
|
||||
await submitWorkOrder({ submitType: submitType.SAFELITE });
|
||||
|
|
|
|||
|
|
@ -3,11 +3,10 @@ import payment from '@/layouts/payment-page/payment-page.vue';
|
|||
|
||||
// Supporting Files
|
||||
import { shallowMount } from '@vue/test-utils';
|
||||
import { getMountOptions } from '@/helpers/unit-test-helper';
|
||||
import { getEnumName, getMountOptions } from '@/helpers/unit-test-helper';
|
||||
import { useMainStore } from '@/store';
|
||||
import { paymentMethods, hopPaymentMethods } from '@/constants/payment-method-constants.js';
|
||||
import { paymentMethods } from '@/constants/payment-method-constants.js';
|
||||
import queryStrings from '@/constants/query-strings';
|
||||
import CartDropdown from '@/iss-components/cart-dropdown/cart-dropdown.vue';
|
||||
import { createTestingPinia } from '@pinia/testing';
|
||||
import settleAllPromises from '@/helpers/layout-helper';
|
||||
import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
|
||||
|
|
@ -207,8 +206,7 @@ const defaultOrder = {
|
|||
},
|
||||
payment: {
|
||||
isInsurance: false,
|
||||
isPayInAdvance: true,
|
||||
payInAdvanceType: 'Afterpay',
|
||||
paymentMethod: paymentMethods.AFTERPAY,
|
||||
inactivePromos: []
|
||||
},
|
||||
schedule: {
|
||||
|
|
@ -239,8 +237,7 @@ describe('payment-page.vue', () => {
|
|||
test('Returns false if pia options are not valid', () => {
|
||||
// Arrange
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
useMainStore().order.payment.isPayInAdvance = null;
|
||||
useMainStore().order.payment.payInAdvanceType = null;
|
||||
useMainStore().order.payment.paymentMethod = null;
|
||||
|
||||
// Act
|
||||
const result = wrapper.vm.arePagePrerequisitesValid();
|
||||
|
|
@ -252,8 +249,7 @@ describe('payment-page.vue', () => {
|
|||
test('Returns false if pay at time of service', () => {
|
||||
// Arrange
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
useMainStore().order.payment.isPayInAdvance = false;
|
||||
useMainStore().order.payment.payInAdvanceType = null;
|
||||
useMainStore().order.payment.paymentMethod = paymentMethods.PAY_AT_TIME_OF_SERVICE;
|
||||
|
||||
// Act
|
||||
const result = wrapper.vm.arePagePrerequisitesValid();
|
||||
|
|
@ -265,94 +261,6 @@ describe('payment-page.vue', () => {
|
|||
});
|
||||
|
||||
describe('payment type mapping', () => {
|
||||
describe('getPaymentType', () => {
|
||||
test('Maps AFTERPAY -> hopPaymentMethods.AFTERPAY', () => {
|
||||
// Arrange
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
useMainStore().order.payment.payInAdvanceType = paymentMethods.AFTERPAY;
|
||||
|
||||
// Act
|
||||
const mapped = wrapper.vm.getPaymentType();
|
||||
|
||||
// Assert
|
||||
expect(mapped).toBe(hopPaymentMethods.AFTERPAY);
|
||||
});
|
||||
|
||||
test('Maps CREDIT_CARD -> hopPaymentMethods.CREDIT_CARD', () => {
|
||||
// Arrange
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
useMainStore().order.payment.payInAdvanceType = paymentMethods.CREDIT_CARD;
|
||||
|
||||
// Act
|
||||
const mapped = wrapper.vm.getPaymentType();
|
||||
|
||||
// Assert
|
||||
expect(mapped).toBe(hopPaymentMethods.CREDIT_CARD);
|
||||
});
|
||||
|
||||
test('Maps PAYPAL -> hopPaymentMethods.PAYPAL', () => {
|
||||
// Arrange
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
useMainStore().order.payment.payInAdvanceType = paymentMethods.PAYPAL;
|
||||
|
||||
// Act
|
||||
const mapped = wrapper.vm.getPaymentType();
|
||||
|
||||
// Assert
|
||||
expect(mapped).toBe(hopPaymentMethods.PAYPAL);
|
||||
});
|
||||
|
||||
test('Maps other values to self', () => {
|
||||
// Arrange
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
useMainStore().order.payment.payInAdvanceType = 'SomeOtherText';
|
||||
|
||||
// Act
|
||||
const mapped = wrapper.vm.getPaymentType();
|
||||
|
||||
// Assert
|
||||
expect(mapped).toBe('SomeOtherText');
|
||||
});
|
||||
});
|
||||
|
||||
describe('cart-dropdown', () => {
|
||||
test('Show cart dropdown if credit card', async () => {
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
wrapper.vm.paymentType = hopPaymentMethods.CREDIT_CARD;
|
||||
|
||||
// Act
|
||||
await wrapper.vm.$nextTick();
|
||||
const cartTable = wrapper.findComponent(CartDropdown);
|
||||
|
||||
// Assert
|
||||
expect(cartTable.exists()).toBeTruthy();
|
||||
});
|
||||
|
||||
test('show cart dropdown if afterpay', async () => {
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
wrapper.vm.paymentType = hopPaymentMethods.AFTERPAY;
|
||||
|
||||
// Act
|
||||
await wrapper.vm.$nextTick();
|
||||
const cartTable = wrapper.findComponent(CartDropdown);
|
||||
|
||||
// Assert
|
||||
expect(cartTable.exists()).toBeTruthy();
|
||||
});
|
||||
|
||||
test('Hide cart dropdown if paypal', async () => {
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
wrapper.vm.paymentType = hopPaymentMethods.PAYPAL;
|
||||
|
||||
// Act
|
||||
await wrapper.vm.$nextTick();
|
||||
const cartTable = wrapper.findComponent(CartDropdown);
|
||||
|
||||
// Assert
|
||||
expect(cartTable.exists()).toBeFalsy();
|
||||
});
|
||||
});
|
||||
|
||||
describe('isPaypal', () => {
|
||||
test('Is responsive if initial data changes', async () => {
|
||||
// Arrange
|
||||
|
|
@ -361,7 +269,7 @@ describe('payment-page.vue', () => {
|
|||
|
||||
// Act
|
||||
const preVal = wrapper.vm.isPaypal;
|
||||
wrapper.vm.paymentType = hopPaymentMethods.PAYPAL;
|
||||
wrapper.vm.paymentType = paymentMethods.PAYPAL;
|
||||
await wrapper.vm.$nextTick();
|
||||
|
||||
const postVal = wrapper.vm.isPaypal;
|
||||
|
|
@ -441,6 +349,7 @@ describe('payment-page.vue', () => {
|
|||
};
|
||||
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
useMainStore().order.payment.paymentMethod = paymentMethods.PayNow;
|
||||
|
||||
// Act
|
||||
wrapper.vm.handleIFrameContentWindowMessage(event);
|
||||
|
|
@ -522,4 +431,26 @@ describe('payment-page.vue', () => {
|
|||
expect(afterPayErrorAlert.isVisible()).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
||||
describe.each([
|
||||
[paymentMethods.CREDIT_CARD, { data: 'creditCardSubmit' }],
|
||||
[paymentMethods.AFTERPAY, { data: 'afterpayPaymentReceived' }],
|
||||
[paymentMethods.APPLEPAY, { data: 'applepayOpened' }],
|
||||
[paymentMethods.PAYPAL, { data: 'showLoaderForPaypal' }]
|
||||
])('handleIFrameContentWindowMessage', (expected, event) => {
|
||||
test(`sets paymentMethod to ${getEnumName(paymentMethods, expected)} when data is ${event.data}`, () => {
|
||||
// Arrange
|
||||
const { wrapper } = getMountedComponent(defaultOrder);
|
||||
useMainStore().order.payment.paymentMethod = paymentMethods.PayNow;
|
||||
|
||||
useMainStore().savePaymentMethodChoice = jest.fn().mockImplementation((value) => {useMainStore().order.payment.paymentMethod = value});
|
||||
|
||||
// Act
|
||||
wrapper.vm.handleIFrameContentWindowMessage(event);
|
||||
const result = useMainStore().order.payment.paymentMethod;
|
||||
|
||||
// Assert
|
||||
expect(result).toBe(expected);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -33,12 +33,12 @@
|
|||
class="hop-iframe payment-iframe"
|
||||
name="card-frame"
|
||||
seamless
|
||||
scrolling="no">
|
||||
scrolling="no"
|
||||
allow="payment *; microphone *; geolocation *;">
|
||||
</iframe>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="isCreditCard || isAfterPay"
|
||||
class="px-2">
|
||||
<hr :class="{'my-0': isCreditCard}">
|
||||
<cartDropdown
|
||||
|
|
@ -73,10 +73,6 @@
|
|||
:target="isPaypal ? '_top' : 'card-frame'"
|
||||
method="POST"
|
||||
:action="checkoutUrl">
|
||||
<input
|
||||
type="hidden"
|
||||
name="paymentType"
|
||||
:value="paymentType" />
|
||||
<input
|
||||
type="hidden"
|
||||
name="sgSessionId"
|
||||
|
|
@ -385,6 +381,10 @@
|
|||
type="hidden"
|
||||
name="calling_application"
|
||||
value="ISSNextGen" />
|
||||
|
||||
<input type="hidden"
|
||||
name="parentdomainname"
|
||||
:value="parentNomainName" />
|
||||
</form>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -403,10 +403,7 @@ import { useMainStore } from '@/store';
|
|||
import iframeResize from 'iframe-resizer/js/iframeResizer.js';
|
||||
import externalUrls from '@/router/router-constants/externalUrl-values.js';
|
||||
import widgetFields from '@/constants/cms-widget-fields.js';
|
||||
import {
|
||||
hopPaymentMethods,
|
||||
paymentMethods
|
||||
} from '@/constants/payment-method-constants.js';
|
||||
import { paymentMethods } from '@/constants/payment-method-constants.js';
|
||||
import { AppointmentTypeStrings } from '@/constants/schedule-constants.js';
|
||||
import queryStrings from '@/constants/query-strings';
|
||||
import alert from '@/ux-components/alert/alert.vue';
|
||||
|
|
@ -440,8 +437,7 @@ export default {
|
|||
// Call APIs
|
||||
const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
|
||||
|
||||
const paymentSignaturePromise =
|
||||
await useMainStore().getPaymentSignature();
|
||||
const paymentSignaturePromise = await useMainStore().getPaymentSignature();
|
||||
|
||||
// Settle promises and get results
|
||||
const promiseResultMap = [
|
||||
|
|
@ -478,7 +474,7 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
checkoutUrl: externalUrls.SAFELITE_HOP,
|
||||
paymentType: this.getPaymentType(),
|
||||
paymentType: useMainStore().order.payment.paymentMethod,
|
||||
authToken: '',
|
||||
authSignature: '',
|
||||
authSignatureStart: '',
|
||||
|
|
@ -503,6 +499,9 @@ export default {
|
|||
};
|
||||
},
|
||||
computed: {
|
||||
parentNomainName() {
|
||||
return window.location.hostname;
|
||||
},
|
||||
payInAdvanceResponseUrl() {
|
||||
const { protocol, host } = window.location;
|
||||
return `${protocol}//${host}/?issPage=${issPageValues.PAYMENT_RETURN}&src=iss-nextgen`;
|
||||
|
|
@ -521,10 +520,7 @@ export default {
|
|||
},
|
||||
getHeaderLine1() {
|
||||
if (!this.isPaypal) {
|
||||
return this.getCmsContent(
|
||||
'PayInAdvanceHeaderLine1',
|
||||
widgetFields.TEXT_BLOCK_WIDGET.TEXT
|
||||
);
|
||||
return this.getCmsContent('PayInAdvanceHeaderLine1', widgetFields.TEXT_BLOCK_WIDGET.TEXT);
|
||||
}
|
||||
return '';
|
||||
},
|
||||
|
|
@ -538,13 +534,13 @@ export default {
|
|||
return '';
|
||||
},
|
||||
isPaypal() {
|
||||
return this.paymentType === hopPaymentMethods.PAYPAL;
|
||||
return this.paymentType === paymentMethods.PAYPAL;
|
||||
},
|
||||
isCreditCard() {
|
||||
return this.paymentType === hopPaymentMethods.CREDIT_CARD;
|
||||
return this.paymentType === paymentMethods.CREDIT_CARD;
|
||||
},
|
||||
isAfterPay() {
|
||||
return this.paymentType === hopPaymentMethods.AFTERPAY;
|
||||
return this.paymentType === paymentMethods.AFTERPAY;
|
||||
},
|
||||
displayPayInAdvanceCreditCardAlert() {
|
||||
return this.displayPayInAdvanceAlert(paymentMethods.CREDIT_CARD);
|
||||
|
|
@ -605,10 +601,7 @@ export default {
|
|||
&& contactInfo.emailAddress
|
||||
);
|
||||
|
||||
const paymentMethodReqs =
|
||||
useMainStore().order.payment.isPayInAdvance !== null
|
||||
&& (useMainStore().order.payment.isPayInAdvance
|
||||
|| !!useMainStore().order.payment.payInAdvanceType);
|
||||
const paymentMethodReqs = useMainStore().isPayInAdvance;
|
||||
|
||||
return (
|
||||
packageReqs
|
||||
|
|
@ -664,18 +657,6 @@ export default {
|
|||
?? useMainStore().order.serviceLocation.provider.address.zipCode
|
||||
);
|
||||
},
|
||||
getPaymentType() {
|
||||
switch (useMainStore().order.payment.payInAdvanceType) {
|
||||
case paymentMethods.AFTERPAY:
|
||||
return hopPaymentMethods.AFTERPAY;
|
||||
case paymentMethods.CREDIT_CARD:
|
||||
return hopPaymentMethods.CREDIT_CARD;
|
||||
case paymentMethods.PAYPAL:
|
||||
return hopPaymentMethods.PAYPAL;
|
||||
default:
|
||||
return useMainStore().payment.payInAdvanceType;
|
||||
}
|
||||
},
|
||||
getPayInAdvanceLineItems(cartItems) {
|
||||
const { glassParts } = useMainStore().order.lineItems;
|
||||
const lineItems =
|
||||
|
|
@ -724,21 +705,12 @@ export default {
|
|||
if (iframe) {
|
||||
iframe.onload = () => {
|
||||
if (iframe.contentWindow) {
|
||||
if (
|
||||
this.paymentType
|
||||
=== hopPaymentMethods.CREDIT_CARD
|
||||
) {
|
||||
iframe.contentWindow.postMessage(
|
||||
'CreditCardChosen',
|
||||
'*'
|
||||
);
|
||||
} else if (
|
||||
this.paymentType === hopPaymentMethods.AFTERPAY
|
||||
) {
|
||||
iframe.contentWindow.postMessage(
|
||||
'afterpay',
|
||||
'*'
|
||||
);
|
||||
iframe.contentWindow.postMessage('hybrid', '*');
|
||||
|
||||
if (this.isAfterPay) {
|
||||
iframe.contentWindow.postMessage('afterpay', '*');
|
||||
} else {
|
||||
iframe.contentWindow.postMessage('CreditCardChosen', '*');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
@ -746,18 +718,34 @@ export default {
|
|||
});
|
||||
},
|
||||
handleIFrameContentWindowMessage(event) {
|
||||
if (typeof event.data === 'string') {
|
||||
if (event.data.indexOf('afterpayClosed') > -1) {
|
||||
this.backButtonAction();
|
||||
}
|
||||
if (event.data.indexOf('creditCardSubmit') > -1) {
|
||||
this.setUIBlock(true);
|
||||
}
|
||||
if (typeof event.data !== 'string') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (event.data.includes('afterpayClosed')) {
|
||||
this.backButtonAction();
|
||||
}
|
||||
|
||||
if (useMainStore().order.payment.paymentMethod !== paymentMethods.PayNow) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (event.data.includes('creditCardSubmit')) {
|
||||
useMainStore().savePaymentMethodChoice(paymentMethods.CREDIT_CARD);
|
||||
this.setUIBlock(true);
|
||||
}
|
||||
if (event.data.includes('afterpayPaymentReceived')) {
|
||||
useMainStore().savePaymentMethodChoice(paymentMethods.AFTERPAY);
|
||||
}
|
||||
if (event.data.includes('applepayOpened')) {
|
||||
useMainStore().savePaymentMethodChoice(paymentMethods.APPLEPAY);
|
||||
}
|
||||
if (event.data.includes('showLoaderForPaypal')) {
|
||||
useMainStore().savePaymentMethodChoice(paymentMethods.PAYPAL);
|
||||
}
|
||||
},
|
||||
setIFrameListener() {
|
||||
window.addEventListener('message', (event) =>
|
||||
this.handleIFrameContentWindowMessage(event));
|
||||
window.addEventListener('message', this.handleIFrameContentWindowMessage);
|
||||
},
|
||||
setUIBlock(val) {
|
||||
this.shouldBlockInteraction = val;
|
||||
|
|
@ -769,8 +757,7 @@ export default {
|
|||
},
|
||||
displayPayInAdvanceAlert(payMethod) {
|
||||
return (
|
||||
this.$route.query[queryStrings.DISPLAY_PAY_IN_ADVANCE_ALERT]
|
||||
=== payMethod
|
||||
this.$route.query[queryStrings.DISPLAY_PAY_IN_ADVANCE_ALERT] === payMethod
|
||||
);
|
||||
},
|
||||
paymentFailedPayLater() {
|
||||
|
|
|
|||
|
|
@ -46,18 +46,18 @@ export default {
|
|||
async mounted() {
|
||||
showIssLoadingModal(true);
|
||||
const payInAdvanceError = getQueryStringParameter(queryStrings.ERROR);
|
||||
const { payInAdvanceType } = useMainStore().order.payment;
|
||||
const { paymentMethod } = useMainStore().order.payment;
|
||||
|
||||
if (payInAdvanceError) {
|
||||
console.error(`Error during payment: ${payInAdvanceError}`);
|
||||
const paymentPageNavScenario =
|
||||
payInAdvanceType === paymentMethods.CREDIT_CARD || payInAdvanceType === paymentMethods.AFTERPAY;
|
||||
paymentMethod === paymentMethods.CREDIT_CARD || paymentMethod === paymentMethods.AFTERPAY;
|
||||
if (paymentPageNavScenario) {
|
||||
this.$router.navigate(
|
||||
this.navigationScenarios.PAY_IN_ADVANCE_CREDIT_CARD_ERROR,
|
||||
this.$route,
|
||||
{
|
||||
[queryStrings.DISPLAY_PAY_IN_ADVANCE_ALERT]: payInAdvanceType
|
||||
[queryStrings.DISPLAY_PAY_IN_ADVANCE_ALERT]: paymentMethod
|
||||
}
|
||||
);
|
||||
} else {
|
||||
|
|
@ -70,16 +70,17 @@ export default {
|
|||
);
|
||||
}
|
||||
} else {
|
||||
switch (payInAdvanceType) {
|
||||
switch (paymentMethod) {
|
||||
case paymentMethods.CREDIT_CARD:
|
||||
case paymentMethods.AFTERPAY:
|
||||
case paymentMethods.APPLEPAY:
|
||||
await this.processCreditCardResponse();
|
||||
break;
|
||||
case paymentMethods.PAYPAL:
|
||||
await this.processPaypalResponse();
|
||||
break;
|
||||
default:
|
||||
console.log(`Unknown pay in advance type: ${payInAdvanceType}`);
|
||||
console.log(`Unknown payment method: ${paymentMethod}`);
|
||||
this.$router.navigate(
|
||||
this.navigationScenarios.PAY_IN_ADVANCE_ERROR,
|
||||
this.$route,
|
||||
|
|
|
|||
|
|
@ -1,39 +1,40 @@
|
|||
/* eslint-disable no-use-before-define */
|
||||
/* eslint-disable max-len */
|
||||
import { defineStore } from 'pinia';
|
||||
import applicationConfig from '@/constants/application-config';
|
||||
import bailoutCode from '@/constants/bailoutCode';
|
||||
import bailoutMessage from '@/constants/bailoutMessage';
|
||||
import coverageStatuses from '@/constants/coverage-statuses';
|
||||
import coverageType from '@/constants/coverage-type';
|
||||
import damageLocationsSelected from '@/constants/damage-locations-selected';
|
||||
import { endpoints } from '@/constants/endpoints';
|
||||
// eslint-disable-next-line import/no-cycle
|
||||
import { getDateForSavedSessionTimeout } from '@/helpers/session-helper';
|
||||
import { experimentSettings, experimentTriggers, experimentUniverses } from '@/constants/experiments';
|
||||
import partNumberStrings from '@/constants/part-number-strings';
|
||||
import partTypeStrings from '@/constants/part-type-strings';
|
||||
import { paymentMethods } from '@/constants/payment-method-constants';
|
||||
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
|
||||
import webStorageConstants from '@/constants/web-storage-constants';
|
||||
// eslint-disable-next-line import/no-cycle
|
||||
import globalMethods from '@/global-methods';
|
||||
import { experimentSettings, experimentTriggers, experimentUniverses } from '@/constants/experiments';
|
||||
import applicationConfig from '@/constants/application-config';
|
||||
import issPageValues from '@/router/router-constants/issPage-values';
|
||||
import damageLocationsSelected from '@/constants/damage-locations-selected';
|
||||
import coverageStatuses from '@/constants/coverage-statuses';
|
||||
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
|
||||
// eslint-disable-next-line import/no-cycle
|
||||
import { getSessionKeyValue, getUserIdValue, deleteISSCookie } from '@/helpers/cookie-helper';
|
||||
import { convertDateStringToDate, getDateDifferenceInDays, militaryToTwelveHourTime } from '@/helpers/date-helper';
|
||||
import { paymentMethods } from '@/constants/payment-method-constants';
|
||||
import webStorageConstants from '@/constants/web-storage-constants';
|
||||
import { getExperimentSettingValue } from '@/helpers/experiment-helper';
|
||||
import { findLineItemIndex, getLineItemsFlattened } from '@/helpers/line-items-helper';
|
||||
import {
|
||||
deductibleForSelectedVehicle, endorsementsForSelectedVehicle,
|
||||
noCoverageForSelectedVehicle,
|
||||
repairWaivedForSelectedVehicle
|
||||
} from '@/helpers/policy-vehicle-helper';
|
||||
import partTypeStrings from '@/constants/part-type-strings';
|
||||
import bailoutMessage from '@/constants/bailoutMessage';
|
||||
import bailoutCode from '@/constants/bailoutCode';
|
||||
import partNumberStrings from '@/constants/part-number-strings';
|
||||
import { findLineItemIndex, getLineItemsFlattened } from '@/helpers/line-items-helper';
|
||||
import {
|
||||
buildQueryStringParameterFromArrayOfComplexObjects, buildURLSearchParams,
|
||||
getLineItemQueryString,
|
||||
buildURLSearchParams,
|
||||
getPartNumbersListForQueryString,
|
||||
getTaxLineItemQueryString
|
||||
} from '@/helpers/querystring-helper';
|
||||
import coverageType from '@/constants/coverage-type';
|
||||
import { getExperimentSettingValue, getFeatureTogglesQueryString } from '@/helpers/experiment-helper';
|
||||
import { getSessionKeyValue, getUserIdValue, deleteISSCookie } from '@/helpers/cookie-helper';
|
||||
import { getTopLevelGlassPartsWithRecal } from '@/helpers/recal-helper';
|
||||
// eslint-disable-next-line import/no-cycle
|
||||
import { getDateForSavedSessionTimeout } from '@/helpers/session-helper';
|
||||
import issPageValues from '@/router/router-constants/issPage-values';
|
||||
|
||||
const storeId = 'main';
|
||||
|
||||
|
|
@ -169,9 +170,8 @@ export const getDefaultState = () => ({
|
|||
},
|
||||
payment: {
|
||||
parentAccountNumber: 0,
|
||||
isPayInAdvance: null,
|
||||
nextGenSettledAmount: 0,
|
||||
payInAdvanceType: null,
|
||||
paymentMethod: null,
|
||||
paypalToken: null,
|
||||
creditCardToken: {
|
||||
subscriptionId: null,
|
||||
|
|
@ -305,6 +305,7 @@ export const useMainStore = defineStore({
|
|||
isUnverified: (s) => s.order.insuranceCoverage.coverageStatus !== coverageStatuses.VERIFIED,
|
||||
isVerified: (state) => state.order.insuranceCoverage.coverageStatus === coverageStatuses.VERIFIED,
|
||||
isPendingClaimRegistration: (state) => state.order.insuranceCoverage.coverageStatus === coverageStatuses.PENDING,
|
||||
isPayInAdvance: (state) => state.order.payment.paymentMethod != null && state.order.payment.paymentMethod !== paymentMethods.PAY_AT_TIME_OF_SERVICE,
|
||||
providerNumber: (state) => state.order.serviceLocation.provider.providerNumber || state.order.serviceLocation.defaultProviderNumber,
|
||||
hasOemEndorsement: (state) => state.order.policy.endorsements?.indexOf('OEM Approved') !== -1 ?? false,
|
||||
eventBusItem: (state) => (eventCategory, eventSubCategory) => {
|
||||
|
|
@ -1000,23 +1001,41 @@ export const useMainStore = defineStore({
|
|||
},
|
||||
|
||||
getProviders(serviceZipCode) {
|
||||
const { carId } = this.order.vehicle;
|
||||
const damageType = this.damage.isRepair ? 'Repair' : 'Replace';
|
||||
const { parentAccountNumber } = this.issConfig;
|
||||
const partsWithRecal = getTopLevelGlassPartsWithRecal(this.order.lineItems.glassParts);
|
||||
const windshieldPartWithRecal = partsWithRecal?.length > 0 ? partsWithRecal[0] : null;
|
||||
const safeliteOnly = true;
|
||||
const shopRadiusInMiles = 100;
|
||||
|
||||
let url = `${endpoints.GetProviders.url}/${serviceZipCode}/${damageType}/${shopRadiusInMiles}/${parentAccountNumber}/${safeliteOnly}/${carId}`;
|
||||
if (windshieldPartWithRecal) {
|
||||
url += `/${windshieldPartWithRecal.partNumber}`;
|
||||
}
|
||||
return globalMethods.callHttpClient({
|
||||
method: endpoints.GetProviders.method,
|
||||
endpoint: `${endpoints.GetProviders.url}/${serviceZipCode}/${damageType}/${shopRadiusInMiles}`
|
||||
endpoint: url
|
||||
});
|
||||
},
|
||||
|
||||
getTpaProviders(zipCode, radius) {
|
||||
const { carId } = this.order.vehicle;
|
||||
const damageType = this.damage.isRepair ? 'Repair' : 'Replace';
|
||||
const { parentAccountNumber } = this.issConfig;
|
||||
const partsWithRecal = getTopLevelGlassPartsWithRecal(this.order.lineItems.glassParts);
|
||||
const windshieldPartWithRecal = partsWithRecal?.length > 0 ? partsWithRecal[0] : null;
|
||||
const safeliteOnly = false;
|
||||
|
||||
let url = `${endpoints.GetProviders.url}/${zipCode}/${damageType}/${radius}/${parentAccountNumber}/${safeliteOnly}/${carId}`;
|
||||
if (windshieldPartWithRecal) {
|
||||
url += `/${windshieldPartWithRecal.partNumber}`;
|
||||
}
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
globalMethods.callHttpClient({
|
||||
method: endpoints.GetProviders.method,
|
||||
endpoint: `${endpoints.GetProviders.url}/${zipCode}/${damageType}/${radius}/${parentAccountNumber}/${safeliteOnly}`
|
||||
endpoint: url
|
||||
}).then((response) => resolve(response), (error) => reject(error));
|
||||
});
|
||||
},
|
||||
|
|
@ -1287,6 +1306,7 @@ export const useMainStore = defineStore({
|
|||
}));
|
||||
|
||||
const params = buildURLSearchParams({
|
||||
applicationName: applicationConfig.APPLICATION_NAME,
|
||||
parentAccountNumber,
|
||||
referralSequenceNumber,
|
||||
zip: serviceZipCode,
|
||||
|
|
@ -1435,8 +1455,9 @@ export const useMainStore = defineStore({
|
|||
},
|
||||
payment: {
|
||||
parentAccountNumber: this.issConfig.parentAccountNumber,
|
||||
billToAccountNumber: this.billToAccountNumber,
|
||||
paypalToken: payment.paypalToken,
|
||||
paymentMethod: payment.payInAdvanceType,
|
||||
paymentMethod: payment.paymentMethod === paymentMethods.PayNow ? null : payment.paymentMethod,
|
||||
nextGenSettledAmount: payment.nextGenSettledAmount,
|
||||
CCToken: payment.creditCardToken
|
||||
},
|
||||
|
|
@ -1479,7 +1500,7 @@ export const useMainStore = defineStore({
|
|||
referralSequenceNumber: this.order.referralSequenceNumber,
|
||||
eon: this.order.eon,
|
||||
submitToMainframe: !!this.order.referralNumber,
|
||||
createWorkOrderNumberForPIA: createWorkOrderNumberForPIA,
|
||||
createWorkOrderNumberForPIA,
|
||||
lockToken: this.order.lockToken,
|
||||
loadedFromDupeCheck,
|
||||
submitAfterSave: !!submitAfterSave
|
||||
|
|
@ -2022,6 +2043,25 @@ export const useMainStore = defineStore({
|
|||
this.order.policy.deductible.replace = null;
|
||||
},
|
||||
|
||||
resetPayment() {
|
||||
this.order.payment.parentAccountNumber = 0;
|
||||
this.order.payment.nextGenSettledAmount = 0;
|
||||
this.order.payment.paymentMethod = null;
|
||||
this.order.payment.paypalToken = null;
|
||||
this.order.payment.creditCardToken.subscriptionId = null;
|
||||
this.order.payment.creditCardToken.expMonth = null;
|
||||
this.order.payment.creditCardToken.expYear = null;
|
||||
this.order.payment.creditCardToken.cardType = null;
|
||||
this.order.payment.creditCardToken.billToPostalCode = null;
|
||||
this.order.payment.creditCardToken.billToFirstName = null;
|
||||
this.order.payment.creditCardToken.billToLastName = null;
|
||||
this.order.payment.creditCardToken.referenceNumber = null;
|
||||
this.order.payment.creditCardToken.authCode = null;
|
||||
this.order.payment.creditCardToken.transactionId = null;
|
||||
this.order.payment.creditCardToken.transReferenceNumber = null;
|
||||
this.order.payment.creditCardToken.lastFour = null;
|
||||
},
|
||||
|
||||
resetCustomer() {
|
||||
this.order.customer.emailAddress = null;
|
||||
this.order.customer.firstName = null;
|
||||
|
|
@ -2765,6 +2805,7 @@ export const useMainStore = defineStore({
|
|||
this.resetOrder();
|
||||
this.resetCustomer();
|
||||
this.resetPolicy();
|
||||
this.resetPayment();
|
||||
this.resetContactInfo();
|
||||
this.resetVehicleState();
|
||||
this.resetDamageState();
|
||||
|
|
@ -2776,9 +2817,7 @@ export const useMainStore = defineStore({
|
|||
this.resetSubmittedOrder();
|
||||
},
|
||||
savePaymentMethodChoice(paymentMethod) {
|
||||
const isPayInAdvance = paymentMethod !== paymentMethods.PAY_AT_TIME_OF_SERVICE;
|
||||
this.order.payment.isPayInAdvance = isPayInAdvance;
|
||||
this.order.payment.payInAdvanceType = isPayInAdvance ? paymentMethod : null;
|
||||
this.order.payment.paymentMethod = paymentMethod;
|
||||
},
|
||||
|
||||
getPaymentSignature() {
|
||||
|
|
@ -2807,6 +2846,7 @@ export const useMainStore = defineStore({
|
|||
submittedOrder.isUnverified = this.isUnverified;
|
||||
submittedOrder.isVerified = this.isVerified;
|
||||
submittedOrder.submitType = submitType;
|
||||
submittedOrder.payment.isPayInAdvance = this.isPayInAdvance;
|
||||
|
||||
// set to local storage
|
||||
window.sessionStorage.setItem(webStorageConstants.SUBMITTED_ORDER, JSON.stringify(submittedOrder));
|
||||
|
|
|
|||
|
|
@ -1937,9 +1937,11 @@ describe('Store', () => {
|
|||
// Arrange
|
||||
globalMethods.callHttpClient = jest.fn().mockReturnValue(Promise.resolve({}));
|
||||
|
||||
const carId = getRandomString(10, 14);
|
||||
const parentAccountNumber = getRandomString(6, 6);
|
||||
store.issConfig.parentAccountNumber = parentAccountNumber;
|
||||
store.order.damage.isRepair = isRepair;
|
||||
store.order.vehicle.carId = carId;
|
||||
const zipCode = getRandomString(6, 6);
|
||||
const radius = getRandomInt(5, 100);
|
||||
const expectedEndpoint = [
|
||||
|
|
@ -1948,7 +1950,8 @@ describe('Store', () => {
|
|||
damageType,
|
||||
radius,
|
||||
parentAccountNumber,
|
||||
'false'
|
||||
'false',
|
||||
carId
|
||||
].join('/');
|
||||
|
||||
// Act
|
||||
|
|
@ -2048,28 +2051,20 @@ describe('Store', () => {
|
|||
});
|
||||
});
|
||||
|
||||
describe('savePaymentMethodChoice method', () => {
|
||||
it('isPayInAdvance saved as false when choice is to pay at time of servce', () => {
|
||||
describe.each([
|
||||
[paymentMethods.CREDIT_CARD],
|
||||
[paymentMethods.AFTERPAY],
|
||||
[paymentMethods.APPLEPAY],
|
||||
[paymentMethods.PAYPAL]
|
||||
])('savePaymentMethodChoice method', (expected) => {
|
||||
test(`sets paymentMethod to ${getEnumName(paymentMethods, expected)} when value is ${getEnumName(paymentMethods, expected)}`, () => {
|
||||
// Arrange
|
||||
const paymentMethod = paymentMethods.PAY_AT_TIME_OF_SERVICE;
|
||||
|
||||
// Act
|
||||
store.savePaymentMethodChoice(paymentMethod);
|
||||
store.savePaymentMethodChoice(expected);
|
||||
|
||||
// Assert
|
||||
expect(store.order.payment.isPayInAdvance).toEqual(false);
|
||||
expect(store.order.payment.payInAdvanceType).toEqual(null);
|
||||
});
|
||||
it('isPayInAdvance saved as true when choice is other than to pay at time of servce', () => {
|
||||
// Arrange
|
||||
const paymentMethod = paymentMethods.CREDIT_CARD;
|
||||
|
||||
// Act
|
||||
store.savePaymentMethodChoice(paymentMethod);
|
||||
|
||||
// Assert
|
||||
expect(store.order.payment.isPayInAdvance).toEqual(true);
|
||||
expect(store.order.payment.payInAdvanceType).toEqual(paymentMethod);
|
||||
expect(store.order.payment.paymentMethod).toBe(expected);
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1,50 +1,357 @@
|
|||
//Libery Mutual Overrides
|
||||
$limu-header-color: #FFD100;
|
||||
$limu-accent-fill: #E6F1F3;
|
||||
$limu-svg-fill-color: '%2309748B';
|
||||
$limu-accent-color: #09748B;
|
||||
$limu-link: #09748B;
|
||||
$limu-button-radius: 8px;
|
||||
$limu-button-text-color: #181643;
|
||||
$limu-button-color: #A9E3E9;
|
||||
// Each Advanced client with custom colors/styles are defined in this file.
|
||||
|
||||
.LibertyMutual {
|
||||
input[type="date"]::-webkit-calendar-picker-indicator {
|
||||
background-color: $limu-accent-fill !important;
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.1762 1.52764H13.7656V1.50352C13.7656 1.10476 13.6076 0.722334 13.3263 0.44037C13.0451 0.158406 12.6636 0 12.2659 0C11.8681 0 11.4866 0.158406 11.2054 0.44037C10.9241 0.722334 10.7661 1.10476 10.7661 1.50352V1.52764H5.42476V1.50352C5.42476 1.10476 5.26675 0.722334 4.9855 0.44037C4.70424 0.158406 4.32277 0 3.92501 0C3.52725 0 3.14579 0.158406 2.86453 0.44037C2.58327 0.722334 2.42526 1.10476 2.42526 1.50352V1.52764H1.82376C1.34046 1.52891 0.877316 1.72195 0.53557 2.06455C0.193824 2.40716 0.00127018 2.87146 0 3.35598V14.1717C0.0016909 14.656 0.194379 15.1201 0.536035 15.4626C0.87769 15.8051 1.34059 15.9983 1.82376 16H14.1746C14.6581 15.9987 15.1214 15.8057 15.4634 15.4632C15.8054 15.1206 15.9983 14.6563 16 14.1717V3.35598C15.9987 2.87146 15.8062 2.40716 15.4644 2.06455C15.1227 1.72195 14.6595 1.52891 14.1762 1.52764ZM11.8889 1.50352C11.8889 1.4033 11.9286 1.30718 11.9993 1.23631C12.07 1.16544 12.1659 1.12563 12.2659 1.12563C12.3658 1.12563 12.4617 1.16544 12.5324 1.23631C12.6031 1.30718 12.6428 1.4033 12.6428 1.50352V2.99899C12.6428 3.09922 12.6031 3.19534 12.5324 3.2662C12.4617 3.33707 12.3658 3.37688 12.2659 3.37688C12.1659 3.37688 12.07 3.33707 11.9993 3.2662C11.9286 3.19534 11.8889 3.09922 11.8889 2.99899V1.50352ZM3.54807 1.50352C3.54807 1.4033 3.58778 1.30718 3.65847 1.23631C3.72916 1.16544 3.82504 1.12563 3.92501 1.12563C4.02498 1.12563 4.12086 1.16544 4.19155 1.23631C4.26224 1.30718 4.30195 1.4033 4.30195 1.50352V2.99899C4.30195 3.09922 4.26224 3.19534 4.19155 3.2662C4.12086 3.33707 4.02498 3.37688 3.92501 3.37688C3.82504 3.37688 3.72916 3.33707 3.65847 3.2662C3.58778 3.19534 3.54807 3.09922 3.54807 2.99899V1.50352ZM14.8772 14.1717C14.8747 14.3573 14.8001 14.5345 14.6691 14.6658C14.5382 14.797 14.3614 14.8719 14.1762 14.8744H1.82536C1.63995 14.8723 1.4627 14.7976 1.33144 14.6663C1.20018 14.5351 1.12531 14.3575 1.12281 14.1717V6.59296H14.8772V14.1717Z' fill='" + $limu-svg-fill-color + "'/%3E%3Cpath d='M2.33063 11.282H3.93464V12.6006C3.93464 12.7499 3.99379 12.8931 4.09907 12.9986C4.20435 13.1041 4.34715 13.1634 4.49604 13.1634C4.64494 13.1634 4.78773 13.1041 4.89301 12.9986C4.9983 12.8931 5.05745 12.7499 5.05745 12.6006V11.282H7.46346V12.6006C7.46346 12.7499 7.52261 12.8931 7.62789 12.9986C7.73318 13.1041 7.87597 13.1634 8.02486 13.1634C8.17376 13.1634 8.31655 13.1041 8.42184 12.9986C8.52712 12.8931 8.58627 12.7499 8.58627 12.6006V11.282H10.9923V12.6006C10.9923 12.7499 11.0514 12.8931 11.1567 12.9986C11.262 13.1041 11.4048 13.1634 11.5537 13.1634C11.7026 13.1634 11.8454 13.1041 11.9507 12.9986C12.0559 12.8931 12.1151 12.7499 12.1151 12.6006V11.282H13.7191C13.868 11.282 14.0108 11.2227 14.1161 11.1172C14.2214 11.0116 14.2805 10.8685 14.2805 10.7192C14.2805 10.57 14.2214 10.4268 14.1161 10.3213C14.0108 10.2157 13.868 10.1564 13.7191 10.1564H12.1151V8.84425C12.1151 8.69498 12.0559 8.55183 11.9507 8.44628C11.8454 8.34073 11.7026 8.28143 11.5537 8.28143C11.4048 8.28143 11.262 8.34073 11.1567 8.44628C11.0514 8.55183 10.9923 8.69498 10.9923 8.84425V10.1628H8.58627V8.84425C8.58627 8.69498 8.52712 8.55183 8.42184 8.44628C8.31655 8.34073 8.17376 8.28143 8.02486 8.28143C7.87597 8.28143 7.73318 8.34073 7.62789 8.44628C7.52261 8.55183 7.46346 8.69498 7.46346 8.84425V10.1628H5.05745V8.84425C5.05745 8.69498 4.9983 8.55183 4.89301 8.44628C4.78773 8.34073 4.64494 8.28143 4.49604 8.28143C4.34715 8.28143 4.20435 8.34073 4.09907 8.44628C3.99379 8.55183 3.93464 8.69498 3.93464 8.84425V10.1628H2.33063C2.18174 10.1628 2.03894 10.2221 1.93366 10.3277C1.82837 10.4332 1.76923 10.5764 1.76923 10.7257C1.76923 10.8749 1.82837 11.0181 1.93366 11.1236C2.03894 11.2292 2.18174 11.2885 2.33063 11.2885V11.282Z' fill='" + $limu-svg-fill-color + "'/%3E%3C/svg%3E") !important;
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: $limu-accent-color !important;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $limu-link !important;
|
||||
// Begin Liberty Mutual, SafeCo Custom Colors and Styles
|
||||
.LibertyMutual,
|
||||
.SafeCo {
|
||||
//Define colors for namespaced classes
|
||||
$header-background: #ffd100;
|
||||
$accent-fill: #e6f1f3; // Calendar background
|
||||
$accent-color: #09748b;
|
||||
$link: #09748b;
|
||||
$button-color: #a9e3e9;
|
||||
$button-text-color: #181643;
|
||||
$svg-fill-color: '%2309748b'; // Color of calendar icon. Place HEX code *after* %23
|
||||
|
||||
.site-header {
|
||||
background-color: $header-background;
|
||||
}
|
||||
|
||||
svg,
|
||||
.modal-text {
|
||||
color: $limu-link !important;
|
||||
fill: $accent-color;
|
||||
}
|
||||
|
||||
.btn {
|
||||
&.btn-override[aria-disabled="false"]:not(.form-test-invalid) {
|
||||
&.btn-primary {
|
||||
background: $limu-button-color !important;
|
||||
color: $limu-button-text-color !important;
|
||||
.container-fluid {
|
||||
input[type="date"]::-webkit-calendar-picker-indicator {
|
||||
background-color: $accent-fill;
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.1762 1.52764H13.7656V1.50352C13.7656 1.10476 13.6076 0.722334 13.3263 0.44037C13.0451 0.158406 12.6636 0 12.2659 0C11.8681 0 11.4866 0.158406 11.2054 0.44037C10.9241 0.722334 10.7661 1.10476 10.7661 1.50352V1.52764H5.42476V1.50352C5.42476 1.10476 5.26675 0.722334 4.9855 0.44037C4.70424 0.158406 4.32277 0 3.92501 0C3.52725 0 3.14579 0.158406 2.86453 0.44037C2.58327 0.722334 2.42526 1.10476 2.42526 1.50352V1.52764H1.82376C1.34046 1.52891 0.877316 1.72195 0.53557 2.06455C0.193824 2.40716 0.00127018 2.87146 0 3.35598V14.1717C0.0016909 14.656 0.194379 15.1201 0.536035 15.4626C0.87769 15.8051 1.34059 15.9983 1.82376 16H14.1746C14.6581 15.9987 15.1214 15.8057 15.4634 15.4632C15.8054 15.1206 15.9983 14.6563 16 14.1717V3.35598C15.9987 2.87146 15.8062 2.40716 15.4644 2.06455C15.1227 1.72195 14.6595 1.52891 14.1762 1.52764ZM11.8889 1.50352C11.8889 1.4033 11.9286 1.30718 11.9993 1.23631C12.07 1.16544 12.1659 1.12563 12.2659 1.12563C12.3658 1.12563 12.4617 1.16544 12.5324 1.23631C12.6031 1.30718 12.6428 1.4033 12.6428 1.50352V2.99899C12.6428 3.09922 12.6031 3.19534 12.5324 3.2662C12.4617 3.33707 12.3658 3.37688 12.2659 3.37688C12.1659 3.37688 12.07 3.33707 11.9993 3.2662C11.9286 3.19534 11.8889 3.09922 11.8889 2.99899V1.50352ZM3.54807 1.50352C3.54807 1.4033 3.58778 1.30718 3.65847 1.23631C3.72916 1.16544 3.82504 1.12563 3.92501 1.12563C4.02498 1.12563 4.12086 1.16544 4.19155 1.23631C4.26224 1.30718 4.30195 1.4033 4.30195 1.50352V2.99899C4.30195 3.09922 4.26224 3.19534 4.19155 3.2662C4.12086 3.33707 4.02498 3.37688 3.92501 3.37688C3.82504 3.37688 3.72916 3.33707 3.65847 3.2662C3.58778 3.19534 3.54807 3.09922 3.54807 2.99899V1.50352ZM14.8772 14.1717C14.8747 14.3573 14.8001 14.5345 14.6691 14.6658C14.5382 14.797 14.3614 14.8719 14.1762 14.8744H1.82536C1.63995 14.8723 1.4627 14.7976 1.33144 14.6663C1.20018 14.5351 1.12531 14.3575 1.12281 14.1717V6.59296H14.8772V14.1717Z' fill='" + $svg-fill-color + "'/%3E%3Cpath d='M2.33063 11.282H3.93464V12.6006C3.93464 12.7499 3.99379 12.8931 4.09907 12.9986C4.20435 13.1041 4.34715 13.1634 4.49604 13.1634C4.64494 13.1634 4.78773 13.1041 4.89301 12.9986C4.9983 12.8931 5.05745 12.7499 5.05745 12.6006V11.282H7.46346V12.6006C7.46346 12.7499 7.52261 12.8931 7.62789 12.9986C7.73318 13.1041 7.87597 13.1634 8.02486 13.1634C8.17376 13.1634 8.31655 13.1041 8.42184 12.9986C8.52712 12.8931 8.58627 12.7499 8.58627 12.6006V11.282H10.9923V12.6006C10.9923 12.7499 11.0514 12.8931 11.1567 12.9986C11.262 13.1041 11.4048 13.1634 11.5537 13.1634C11.7026 13.1634 11.8454 13.1041 11.9507 12.9986C12.0559 12.8931 12.1151 12.7499 12.1151 12.6006V11.282H13.7191C13.868 11.282 14.0108 11.2227 14.1161 11.1172C14.2214 11.0116 14.2805 10.8685 14.2805 10.7192C14.2805 10.57 14.2214 10.4268 14.1161 10.3213C14.0108 10.2157 13.868 10.1564 13.7191 10.1564H12.1151V8.84425C12.1151 8.69498 12.0559 8.55183 11.9507 8.44628C11.8454 8.34073 11.7026 8.28143 11.5537 8.28143C11.4048 8.28143 11.262 8.34073 11.1567 8.44628C11.0514 8.55183 10.9923 8.69498 10.9923 8.84425V10.1628H8.58627V8.84425C8.58627 8.69498 8.52712 8.55183 8.42184 8.44628C8.31655 8.34073 8.17376 8.28143 8.02486 8.28143C7.87597 8.28143 7.73318 8.34073 7.62789 8.44628C7.52261 8.55183 7.46346 8.69498 7.46346 8.84425V10.1628H5.05745V8.84425C5.05745 8.69498 4.9983 8.55183 4.89301 8.44628C4.78773 8.34073 4.64494 8.28143 4.49604 8.28143C4.34715 8.28143 4.20435 8.34073 4.09907 8.44628C3.99379 8.55183 3.93464 8.69498 3.93464 8.84425V10.1628H2.33063C2.18174 10.1628 2.03894 10.2221 1.93366 10.3277C1.82837 10.4332 1.76923 10.5764 1.76923 10.7257C1.76923 10.8749 1.82837 11.0181 1.93366 11.1236C2.03894 11.2292 2.18174 11.2885 2.33063 11.2885V11.282Z' fill='" + $svg-fill-color + "'/%3E%3C/svg%3E");
|
||||
}
|
||||
a,
|
||||
a.new-window-link {
|
||||
color: $link;
|
||||
}
|
||||
footer {
|
||||
a {
|
||||
color: $link;
|
||||
}
|
||||
.btn {
|
||||
&.btn-override[aria-disabled="false"]:not(.form-test-invalid) {
|
||||
&.btn-primary {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
background: $limu-button-color !important;
|
||||
color: $limu-button-text-color !important;
|
||||
box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $limu-button-color !important;
|
||||
&:focus-visible {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $button-color;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.loader {
|
||||
&:after {
|
||||
background-color: $button-text-color;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.loader {
|
||||
&:after {
|
||||
background-color: $limu-button-text-color !important;
|
||||
&.modal-open {
|
||||
.modal {
|
||||
.modal-footer {
|
||||
.btn {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// End Liberty Mutual, SafeCo
|
||||
|
||||
|
||||
|
||||
// Begin Amica Custom Colors and Styles
|
||||
.amica {
|
||||
//Define colors for namespaced classes
|
||||
$header-background: #fff;
|
||||
$accent-fill: #e7f1f6; // Calendar background
|
||||
$accent-color: #00a88f;
|
||||
$link: #00a88f;
|
||||
$button-color: #5508a5;
|
||||
$button-text-color: #fff;
|
||||
$svg-fill-color: '%231574a1'; // Color of calendar icon. Place HEX code *after* %23
|
||||
|
||||
.site-header {
|
||||
background-color: $header-background;
|
||||
}
|
||||
|
||||
svg,
|
||||
.modal-text {
|
||||
fill: $accent-color;
|
||||
color: $accent-color;
|
||||
}
|
||||
|
||||
.container-fluid {
|
||||
input[type="date"]::-webkit-calendar-picker-indicator {
|
||||
background-color: $accent-fill;
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.1762 1.52764H13.7656V1.50352C13.7656 1.10476 13.6076 0.722334 13.3263 0.44037C13.0451 0.158406 12.6636 0 12.2659 0C11.8681 0 11.4866 0.158406 11.2054 0.44037C10.9241 0.722334 10.7661 1.10476 10.7661 1.50352V1.52764H5.42476V1.50352C5.42476 1.10476 5.26675 0.722334 4.9855 0.44037C4.70424 0.158406 4.32277 0 3.92501 0C3.52725 0 3.14579 0.158406 2.86453 0.44037C2.58327 0.722334 2.42526 1.10476 2.42526 1.50352V1.52764H1.82376C1.34046 1.52891 0.877316 1.72195 0.53557 2.06455C0.193824 2.40716 0.00127018 2.87146 0 3.35598V14.1717C0.0016909 14.656 0.194379 15.1201 0.536035 15.4626C0.87769 15.8051 1.34059 15.9983 1.82376 16H14.1746C14.6581 15.9987 15.1214 15.8057 15.4634 15.4632C15.8054 15.1206 15.9983 14.6563 16 14.1717V3.35598C15.9987 2.87146 15.8062 2.40716 15.4644 2.06455C15.1227 1.72195 14.6595 1.52891 14.1762 1.52764ZM11.8889 1.50352C11.8889 1.4033 11.9286 1.30718 11.9993 1.23631C12.07 1.16544 12.1659 1.12563 12.2659 1.12563C12.3658 1.12563 12.4617 1.16544 12.5324 1.23631C12.6031 1.30718 12.6428 1.4033 12.6428 1.50352V2.99899C12.6428 3.09922 12.6031 3.19534 12.5324 3.2662C12.4617 3.33707 12.3658 3.37688 12.2659 3.37688C12.1659 3.37688 12.07 3.33707 11.9993 3.2662C11.9286 3.19534 11.8889 3.09922 11.8889 2.99899V1.50352ZM3.54807 1.50352C3.54807 1.4033 3.58778 1.30718 3.65847 1.23631C3.72916 1.16544 3.82504 1.12563 3.92501 1.12563C4.02498 1.12563 4.12086 1.16544 4.19155 1.23631C4.26224 1.30718 4.30195 1.4033 4.30195 1.50352V2.99899C4.30195 3.09922 4.26224 3.19534 4.19155 3.2662C4.12086 3.33707 4.02498 3.37688 3.92501 3.37688C3.82504 3.37688 3.72916 3.33707 3.65847 3.2662C3.58778 3.19534 3.54807 3.09922 3.54807 2.99899V1.50352ZM14.8772 14.1717C14.8747 14.3573 14.8001 14.5345 14.6691 14.6658C14.5382 14.797 14.3614 14.8719 14.1762 14.8744H1.82536C1.63995 14.8723 1.4627 14.7976 1.33144 14.6663C1.20018 14.5351 1.12531 14.3575 1.12281 14.1717V6.59296H14.8772V14.1717Z' fill='" + $svg-fill-color + "'/%3E%3Cpath d='M2.33063 11.282H3.93464V12.6006C3.93464 12.7499 3.99379 12.8931 4.09907 12.9986C4.20435 13.1041 4.34715 13.1634 4.49604 13.1634C4.64494 13.1634 4.78773 13.1041 4.89301 12.9986C4.9983 12.8931 5.05745 12.7499 5.05745 12.6006V11.282H7.46346V12.6006C7.46346 12.7499 7.52261 12.8931 7.62789 12.9986C7.73318 13.1041 7.87597 13.1634 8.02486 13.1634C8.17376 13.1634 8.31655 13.1041 8.42184 12.9986C8.52712 12.8931 8.58627 12.7499 8.58627 12.6006V11.282H10.9923V12.6006C10.9923 12.7499 11.0514 12.8931 11.1567 12.9986C11.262 13.1041 11.4048 13.1634 11.5537 13.1634C11.7026 13.1634 11.8454 13.1041 11.9507 12.9986C12.0559 12.8931 12.1151 12.7499 12.1151 12.6006V11.282H13.7191C13.868 11.282 14.0108 11.2227 14.1161 11.1172C14.2214 11.0116 14.2805 10.8685 14.2805 10.7192C14.2805 10.57 14.2214 10.4268 14.1161 10.3213C14.0108 10.2157 13.868 10.1564 13.7191 10.1564H12.1151V8.84425C12.1151 8.69498 12.0559 8.55183 11.9507 8.44628C11.8454 8.34073 11.7026 8.28143 11.5537 8.28143C11.4048 8.28143 11.262 8.34073 11.1567 8.44628C11.0514 8.55183 10.9923 8.69498 10.9923 8.84425V10.1628H8.58627V8.84425C8.58627 8.69498 8.52712 8.55183 8.42184 8.44628C8.31655 8.34073 8.17376 8.28143 8.02486 8.28143C7.87597 8.28143 7.73318 8.34073 7.62789 8.44628C7.52261 8.55183 7.46346 8.69498 7.46346 8.84425V10.1628H5.05745V8.84425C5.05745 8.69498 4.9983 8.55183 4.89301 8.44628C4.78773 8.34073 4.64494 8.28143 4.49604 8.28143C4.34715 8.28143 4.20435 8.34073 4.09907 8.44628C3.99379 8.55183 3.93464 8.69498 3.93464 8.84425V10.1628H2.33063C2.18174 10.1628 2.03894 10.2221 1.93366 10.3277C1.82837 10.4332 1.76923 10.5764 1.76923 10.7257C1.76923 10.8749 1.82837 11.0181 1.93366 11.1236C2.03894 11.2292 2.18174 11.2885 2.33063 11.2885V11.282Z' fill='" + $svg-fill-color + "'/%3E%3C/svg%3E");
|
||||
}
|
||||
a,
|
||||
a.new-window-link,
|
||||
.btn-link {
|
||||
color: $link;
|
||||
}
|
||||
footer {
|
||||
a {
|
||||
color: $link;
|
||||
}
|
||||
.btn {
|
||||
&.btn-override[aria-disabled="false"]:not(.form-test-invalid) {
|
||||
&.btn-primary {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $button-color;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.loader {
|
||||
&:after {
|
||||
background-color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.modal-open {
|
||||
.modal {
|
||||
.modal-footer {
|
||||
.btn {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// End Amica
|
||||
|
||||
|
||||
|
||||
// Begin Nationwide Custom Colors and Styles
|
||||
.Nationwide.Insurance {
|
||||
//Define colors for namespaced classes
|
||||
$header-background: #fff;
|
||||
$accent-fill: #e6f1f3; // Calendar background
|
||||
$accent-color: #1c57a5;
|
||||
$link: #1c57a5;
|
||||
$button-color: #1c57a5;
|
||||
$button-text-color: #fff;
|
||||
$svg-fill-color: '%231c57a5'; // Color of calendar icon. Place HEX code *after* %23
|
||||
|
||||
.site-header {
|
||||
background-color: $header-background;
|
||||
}
|
||||
|
||||
svg,
|
||||
.modal-text {
|
||||
fill: $accent-color;
|
||||
}
|
||||
|
||||
.container-fluid {
|
||||
input[type="date"]::-webkit-calendar-picker-indicator {
|
||||
background-color: $accent-fill;
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.1762 1.52764H13.7656V1.50352C13.7656 1.10476 13.6076 0.722334 13.3263 0.44037C13.0451 0.158406 12.6636 0 12.2659 0C11.8681 0 11.4866 0.158406 11.2054 0.44037C10.9241 0.722334 10.7661 1.10476 10.7661 1.50352V1.52764H5.42476V1.50352C5.42476 1.10476 5.26675 0.722334 4.9855 0.44037C4.70424 0.158406 4.32277 0 3.92501 0C3.52725 0 3.14579 0.158406 2.86453 0.44037C2.58327 0.722334 2.42526 1.10476 2.42526 1.50352V1.52764H1.82376C1.34046 1.52891 0.877316 1.72195 0.53557 2.06455C0.193824 2.40716 0.00127018 2.87146 0 3.35598V14.1717C0.0016909 14.656 0.194379 15.1201 0.536035 15.4626C0.87769 15.8051 1.34059 15.9983 1.82376 16H14.1746C14.6581 15.9987 15.1214 15.8057 15.4634 15.4632C15.8054 15.1206 15.9983 14.6563 16 14.1717V3.35598C15.9987 2.87146 15.8062 2.40716 15.4644 2.06455C15.1227 1.72195 14.6595 1.52891 14.1762 1.52764ZM11.8889 1.50352C11.8889 1.4033 11.9286 1.30718 11.9993 1.23631C12.07 1.16544 12.1659 1.12563 12.2659 1.12563C12.3658 1.12563 12.4617 1.16544 12.5324 1.23631C12.6031 1.30718 12.6428 1.4033 12.6428 1.50352V2.99899C12.6428 3.09922 12.6031 3.19534 12.5324 3.2662C12.4617 3.33707 12.3658 3.37688 12.2659 3.37688C12.1659 3.37688 12.07 3.33707 11.9993 3.2662C11.9286 3.19534 11.8889 3.09922 11.8889 2.99899V1.50352ZM3.54807 1.50352C3.54807 1.4033 3.58778 1.30718 3.65847 1.23631C3.72916 1.16544 3.82504 1.12563 3.92501 1.12563C4.02498 1.12563 4.12086 1.16544 4.19155 1.23631C4.26224 1.30718 4.30195 1.4033 4.30195 1.50352V2.99899C4.30195 3.09922 4.26224 3.19534 4.19155 3.2662C4.12086 3.33707 4.02498 3.37688 3.92501 3.37688C3.82504 3.37688 3.72916 3.33707 3.65847 3.2662C3.58778 3.19534 3.54807 3.09922 3.54807 2.99899V1.50352ZM14.8772 14.1717C14.8747 14.3573 14.8001 14.5345 14.6691 14.6658C14.5382 14.797 14.3614 14.8719 14.1762 14.8744H1.82536C1.63995 14.8723 1.4627 14.7976 1.33144 14.6663C1.20018 14.5351 1.12531 14.3575 1.12281 14.1717V6.59296H14.8772V14.1717Z' fill='" + $svg-fill-color + "'/%3E%3Cpath d='M2.33063 11.282H3.93464V12.6006C3.93464 12.7499 3.99379 12.8931 4.09907 12.9986C4.20435 13.1041 4.34715 13.1634 4.49604 13.1634C4.64494 13.1634 4.78773 13.1041 4.89301 12.9986C4.9983 12.8931 5.05745 12.7499 5.05745 12.6006V11.282H7.46346V12.6006C7.46346 12.7499 7.52261 12.8931 7.62789 12.9986C7.73318 13.1041 7.87597 13.1634 8.02486 13.1634C8.17376 13.1634 8.31655 13.1041 8.42184 12.9986C8.52712 12.8931 8.58627 12.7499 8.58627 12.6006V11.282H10.9923V12.6006C10.9923 12.7499 11.0514 12.8931 11.1567 12.9986C11.262 13.1041 11.4048 13.1634 11.5537 13.1634C11.7026 13.1634 11.8454 13.1041 11.9507 12.9986C12.0559 12.8931 12.1151 12.7499 12.1151 12.6006V11.282H13.7191C13.868 11.282 14.0108 11.2227 14.1161 11.1172C14.2214 11.0116 14.2805 10.8685 14.2805 10.7192C14.2805 10.57 14.2214 10.4268 14.1161 10.3213C14.0108 10.2157 13.868 10.1564 13.7191 10.1564H12.1151V8.84425C12.1151 8.69498 12.0559 8.55183 11.9507 8.44628C11.8454 8.34073 11.7026 8.28143 11.5537 8.28143C11.4048 8.28143 11.262 8.34073 11.1567 8.44628C11.0514 8.55183 10.9923 8.69498 10.9923 8.84425V10.1628H8.58627V8.84425C8.58627 8.69498 8.52712 8.55183 8.42184 8.44628C8.31655 8.34073 8.17376 8.28143 8.02486 8.28143C7.87597 8.28143 7.73318 8.34073 7.62789 8.44628C7.52261 8.55183 7.46346 8.69498 7.46346 8.84425V10.1628H5.05745V8.84425C5.05745 8.69498 4.9983 8.55183 4.89301 8.44628C4.78773 8.34073 4.64494 8.28143 4.49604 8.28143C4.34715 8.28143 4.20435 8.34073 4.09907 8.44628C3.99379 8.55183 3.93464 8.69498 3.93464 8.84425V10.1628H2.33063C2.18174 10.1628 2.03894 10.2221 1.93366 10.3277C1.82837 10.4332 1.76923 10.5764 1.76923 10.7257C1.76923 10.8749 1.82837 11.0181 1.93366 11.1236C2.03894 11.2292 2.18174 11.2885 2.33063 11.2885V11.282Z' fill='" + $svg-fill-color + "'/%3E%3C/svg%3E");
|
||||
}
|
||||
a,
|
||||
a.new-window-link {
|
||||
color: $link;
|
||||
}
|
||||
footer {
|
||||
a {
|
||||
color: $link;
|
||||
}
|
||||
.btn {
|
||||
&.btn-override[aria-disabled="false"]:not(.form-test-invalid) {
|
||||
&.btn-primary {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $button-color;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.loader {
|
||||
&:after {
|
||||
background-color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.modal-open {
|
||||
.modal {
|
||||
.modal-footer {
|
||||
.btn {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// End Nationwide
|
||||
|
||||
|
||||
|
||||
// Begin Country Financial Custom Colors and Styles
|
||||
.CountryFinancial {
|
||||
//Define colors for namespaced classes
|
||||
$header-background: #fff;
|
||||
$accent-fill: #e6f1f3; // Calendar background
|
||||
$accent-color: #007a3e;
|
||||
$link: #007a3e;
|
||||
$button-color: #007a3e;
|
||||
$button-text-color: #fff;
|
||||
$svg-fill-color: '%23007a3e'; // Color of calendar icon. Place HEX code *after* %23
|
||||
|
||||
.site-header {
|
||||
background-color: $header-background;
|
||||
}
|
||||
|
||||
svg,
|
||||
.modal-text {
|
||||
fill: $accent-color;
|
||||
}
|
||||
|
||||
.container-fluid {
|
||||
input[type="date"]::-webkit-calendar-picker-indicator {
|
||||
background-color: $accent-fill;
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.1762 1.52764H13.7656V1.50352C13.7656 1.10476 13.6076 0.722334 13.3263 0.44037C13.0451 0.158406 12.6636 0 12.2659 0C11.8681 0 11.4866 0.158406 11.2054 0.44037C10.9241 0.722334 10.7661 1.10476 10.7661 1.50352V1.52764H5.42476V1.50352C5.42476 1.10476 5.26675 0.722334 4.9855 0.44037C4.70424 0.158406 4.32277 0 3.92501 0C3.52725 0 3.14579 0.158406 2.86453 0.44037C2.58327 0.722334 2.42526 1.10476 2.42526 1.50352V1.52764H1.82376C1.34046 1.52891 0.877316 1.72195 0.53557 2.06455C0.193824 2.40716 0.00127018 2.87146 0 3.35598V14.1717C0.0016909 14.656 0.194379 15.1201 0.536035 15.4626C0.87769 15.8051 1.34059 15.9983 1.82376 16H14.1746C14.6581 15.9987 15.1214 15.8057 15.4634 15.4632C15.8054 15.1206 15.9983 14.6563 16 14.1717V3.35598C15.9987 2.87146 15.8062 2.40716 15.4644 2.06455C15.1227 1.72195 14.6595 1.52891 14.1762 1.52764ZM11.8889 1.50352C11.8889 1.4033 11.9286 1.30718 11.9993 1.23631C12.07 1.16544 12.1659 1.12563 12.2659 1.12563C12.3658 1.12563 12.4617 1.16544 12.5324 1.23631C12.6031 1.30718 12.6428 1.4033 12.6428 1.50352V2.99899C12.6428 3.09922 12.6031 3.19534 12.5324 3.2662C12.4617 3.33707 12.3658 3.37688 12.2659 3.37688C12.1659 3.37688 12.07 3.33707 11.9993 3.2662C11.9286 3.19534 11.8889 3.09922 11.8889 2.99899V1.50352ZM3.54807 1.50352C3.54807 1.4033 3.58778 1.30718 3.65847 1.23631C3.72916 1.16544 3.82504 1.12563 3.92501 1.12563C4.02498 1.12563 4.12086 1.16544 4.19155 1.23631C4.26224 1.30718 4.30195 1.4033 4.30195 1.50352V2.99899C4.30195 3.09922 4.26224 3.19534 4.19155 3.2662C4.12086 3.33707 4.02498 3.37688 3.92501 3.37688C3.82504 3.37688 3.72916 3.33707 3.65847 3.2662C3.58778 3.19534 3.54807 3.09922 3.54807 2.99899V1.50352ZM14.8772 14.1717C14.8747 14.3573 14.8001 14.5345 14.6691 14.6658C14.5382 14.797 14.3614 14.8719 14.1762 14.8744H1.82536C1.63995 14.8723 1.4627 14.7976 1.33144 14.6663C1.20018 14.5351 1.12531 14.3575 1.12281 14.1717V6.59296H14.8772V14.1717Z' fill='" + $svg-fill-color + "'/%3E%3Cpath d='M2.33063 11.282H3.93464V12.6006C3.93464 12.7499 3.99379 12.8931 4.09907 12.9986C4.20435 13.1041 4.34715 13.1634 4.49604 13.1634C4.64494 13.1634 4.78773 13.1041 4.89301 12.9986C4.9983 12.8931 5.05745 12.7499 5.05745 12.6006V11.282H7.46346V12.6006C7.46346 12.7499 7.52261 12.8931 7.62789 12.9986C7.73318 13.1041 7.87597 13.1634 8.02486 13.1634C8.17376 13.1634 8.31655 13.1041 8.42184 12.9986C8.52712 12.8931 8.58627 12.7499 8.58627 12.6006V11.282H10.9923V12.6006C10.9923 12.7499 11.0514 12.8931 11.1567 12.9986C11.262 13.1041 11.4048 13.1634 11.5537 13.1634C11.7026 13.1634 11.8454 13.1041 11.9507 12.9986C12.0559 12.8931 12.1151 12.7499 12.1151 12.6006V11.282H13.7191C13.868 11.282 14.0108 11.2227 14.1161 11.1172C14.2214 11.0116 14.2805 10.8685 14.2805 10.7192C14.2805 10.57 14.2214 10.4268 14.1161 10.3213C14.0108 10.2157 13.868 10.1564 13.7191 10.1564H12.1151V8.84425C12.1151 8.69498 12.0559 8.55183 11.9507 8.44628C11.8454 8.34073 11.7026 8.28143 11.5537 8.28143C11.4048 8.28143 11.262 8.34073 11.1567 8.44628C11.0514 8.55183 10.9923 8.69498 10.9923 8.84425V10.1628H8.58627V8.84425C8.58627 8.69498 8.52712 8.55183 8.42184 8.44628C8.31655 8.34073 8.17376 8.28143 8.02486 8.28143C7.87597 8.28143 7.73318 8.34073 7.62789 8.44628C7.52261 8.55183 7.46346 8.69498 7.46346 8.84425V10.1628H5.05745V8.84425C5.05745 8.69498 4.9983 8.55183 4.89301 8.44628C4.78773 8.34073 4.64494 8.28143 4.49604 8.28143C4.34715 8.28143 4.20435 8.34073 4.09907 8.44628C3.99379 8.55183 3.93464 8.69498 3.93464 8.84425V10.1628H2.33063C2.18174 10.1628 2.03894 10.2221 1.93366 10.3277C1.82837 10.4332 1.76923 10.5764 1.76923 10.7257C1.76923 10.8749 1.82837 11.0181 1.93366 11.1236C2.03894 11.2292 2.18174 11.2885 2.33063 11.2885V11.282Z' fill='" + $svg-fill-color + "'/%3E%3C/svg%3E");
|
||||
}
|
||||
a,
|
||||
a.new-window-link {
|
||||
color: $link;
|
||||
}
|
||||
footer {
|
||||
a {
|
||||
color: $link;
|
||||
}
|
||||
.btn {
|
||||
&.btn-override[aria-disabled="false"]:not(.form-test-invalid) {
|
||||
&.btn-primary {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $button-color;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.loader {
|
||||
&:after {
|
||||
background-color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.modal-open {
|
||||
.modal {
|
||||
.modal-footer {
|
||||
.btn {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// End Country Financial
|
||||
|
||||
|
||||
|
||||
// Begin Travelers Custom Colors and Styles
|
||||
.Travelers.Insurance {
|
||||
//Define colors for namespaced classes
|
||||
$header-background: #fff;
|
||||
$accent-fill: #e6f1f3; // Calendar background
|
||||
$accent-color: #007395;
|
||||
$link: #007395;
|
||||
$button-color: #e01719;
|
||||
$button-text-color: #fff;
|
||||
$svg-fill-color: '%23007395'; // Color of calendar icon. Place HEX code *after* %23
|
||||
|
||||
.site-header {
|
||||
background-color: $header-background;
|
||||
}
|
||||
|
||||
svg,
|
||||
.modal-text {
|
||||
fill: $accent-color;
|
||||
}
|
||||
|
||||
.container-fluid {
|
||||
input[type="date"]::-webkit-calendar-picker-indicator {
|
||||
background-color: $accent-fill;
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.1762 1.52764H13.7656V1.50352C13.7656 1.10476 13.6076 0.722334 13.3263 0.44037C13.0451 0.158406 12.6636 0 12.2659 0C11.8681 0 11.4866 0.158406 11.2054 0.44037C10.9241 0.722334 10.7661 1.10476 10.7661 1.50352V1.52764H5.42476V1.50352C5.42476 1.10476 5.26675 0.722334 4.9855 0.44037C4.70424 0.158406 4.32277 0 3.92501 0C3.52725 0 3.14579 0.158406 2.86453 0.44037C2.58327 0.722334 2.42526 1.10476 2.42526 1.50352V1.52764H1.82376C1.34046 1.52891 0.877316 1.72195 0.53557 2.06455C0.193824 2.40716 0.00127018 2.87146 0 3.35598V14.1717C0.0016909 14.656 0.194379 15.1201 0.536035 15.4626C0.87769 15.8051 1.34059 15.9983 1.82376 16H14.1746C14.6581 15.9987 15.1214 15.8057 15.4634 15.4632C15.8054 15.1206 15.9983 14.6563 16 14.1717V3.35598C15.9987 2.87146 15.8062 2.40716 15.4644 2.06455C15.1227 1.72195 14.6595 1.52891 14.1762 1.52764ZM11.8889 1.50352C11.8889 1.4033 11.9286 1.30718 11.9993 1.23631C12.07 1.16544 12.1659 1.12563 12.2659 1.12563C12.3658 1.12563 12.4617 1.16544 12.5324 1.23631C12.6031 1.30718 12.6428 1.4033 12.6428 1.50352V2.99899C12.6428 3.09922 12.6031 3.19534 12.5324 3.2662C12.4617 3.33707 12.3658 3.37688 12.2659 3.37688C12.1659 3.37688 12.07 3.33707 11.9993 3.2662C11.9286 3.19534 11.8889 3.09922 11.8889 2.99899V1.50352ZM3.54807 1.50352C3.54807 1.4033 3.58778 1.30718 3.65847 1.23631C3.72916 1.16544 3.82504 1.12563 3.92501 1.12563C4.02498 1.12563 4.12086 1.16544 4.19155 1.23631C4.26224 1.30718 4.30195 1.4033 4.30195 1.50352V2.99899C4.30195 3.09922 4.26224 3.19534 4.19155 3.2662C4.12086 3.33707 4.02498 3.37688 3.92501 3.37688C3.82504 3.37688 3.72916 3.33707 3.65847 3.2662C3.58778 3.19534 3.54807 3.09922 3.54807 2.99899V1.50352ZM14.8772 14.1717C14.8747 14.3573 14.8001 14.5345 14.6691 14.6658C14.5382 14.797 14.3614 14.8719 14.1762 14.8744H1.82536C1.63995 14.8723 1.4627 14.7976 1.33144 14.6663C1.20018 14.5351 1.12531 14.3575 1.12281 14.1717V6.59296H14.8772V14.1717Z' fill='" + $svg-fill-color + "'/%3E%3Cpath d='M2.33063 11.282H3.93464V12.6006C3.93464 12.7499 3.99379 12.8931 4.09907 12.9986C4.20435 13.1041 4.34715 13.1634 4.49604 13.1634C4.64494 13.1634 4.78773 13.1041 4.89301 12.9986C4.9983 12.8931 5.05745 12.7499 5.05745 12.6006V11.282H7.46346V12.6006C7.46346 12.7499 7.52261 12.8931 7.62789 12.9986C7.73318 13.1041 7.87597 13.1634 8.02486 13.1634C8.17376 13.1634 8.31655 13.1041 8.42184 12.9986C8.52712 12.8931 8.58627 12.7499 8.58627 12.6006V11.282H10.9923V12.6006C10.9923 12.7499 11.0514 12.8931 11.1567 12.9986C11.262 13.1041 11.4048 13.1634 11.5537 13.1634C11.7026 13.1634 11.8454 13.1041 11.9507 12.9986C12.0559 12.8931 12.1151 12.7499 12.1151 12.6006V11.282H13.7191C13.868 11.282 14.0108 11.2227 14.1161 11.1172C14.2214 11.0116 14.2805 10.8685 14.2805 10.7192C14.2805 10.57 14.2214 10.4268 14.1161 10.3213C14.0108 10.2157 13.868 10.1564 13.7191 10.1564H12.1151V8.84425C12.1151 8.69498 12.0559 8.55183 11.9507 8.44628C11.8454 8.34073 11.7026 8.28143 11.5537 8.28143C11.4048 8.28143 11.262 8.34073 11.1567 8.44628C11.0514 8.55183 10.9923 8.69498 10.9923 8.84425V10.1628H8.58627V8.84425C8.58627 8.69498 8.52712 8.55183 8.42184 8.44628C8.31655 8.34073 8.17376 8.28143 8.02486 8.28143C7.87597 8.28143 7.73318 8.34073 7.62789 8.44628C7.52261 8.55183 7.46346 8.69498 7.46346 8.84425V10.1628H5.05745V8.84425C5.05745 8.69498 4.9983 8.55183 4.89301 8.44628C4.78773 8.34073 4.64494 8.28143 4.49604 8.28143C4.34715 8.28143 4.20435 8.34073 4.09907 8.44628C3.99379 8.55183 3.93464 8.69498 3.93464 8.84425V10.1628H2.33063C2.18174 10.1628 2.03894 10.2221 1.93366 10.3277C1.82837 10.4332 1.76923 10.5764 1.76923 10.7257C1.76923 10.8749 1.82837 11.0181 1.93366 11.1236C2.03894 11.2292 2.18174 11.2885 2.33063 11.2885V11.282Z' fill='" + $svg-fill-color + "'/%3E%3C/svg%3E");
|
||||
}
|
||||
a,
|
||||
a.new-window-link {
|
||||
color: $link;
|
||||
}
|
||||
footer {
|
||||
a {
|
||||
color: $link;
|
||||
}
|
||||
.btn {
|
||||
&.btn-override[aria-disabled="false"]:not(.form-test-invalid) {
|
||||
&.btn-primary {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $button-color;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.loader {
|
||||
&:after {
|
||||
background-color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.modal-open {
|
||||
.modal {
|
||||
.modal-footer {
|
||||
.btn {
|
||||
background: $button-color;
|
||||
color: $button-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// End Travelers
|
||||
|
|
@ -14,6 +14,7 @@ body {
|
|||
.prevent-squish {
|
||||
overflow-x: unset;
|
||||
}
|
||||
|
||||
&.fade-on-route-transition {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
|
|
@ -90,6 +91,18 @@ body {
|
|||
.pac-container {
|
||||
z-index: 10000 !important;
|
||||
}
|
||||
|
||||
div#app:has(~ div#onetrust-consent-sdk div#onetrust-banner-sdk[style]) {
|
||||
padding-bottom: 3rem;
|
||||
|
||||
@include media-breakpoint-up(xl) {
|
||||
padding-bottom: unset;
|
||||
}
|
||||
}
|
||||
|
||||
div#app:has(~ div#onetrust-consent-sdk div#onetrust-banner-sdk[style*="display: none"]) {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.modal-open {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ process.env.VUE_APP_CONSUMER_CF_DISTRO = 'https://digitalapi.dev.safelite.io';
|
|||
process.env.VUE_APP_CURRENT_ENVIRONMENT = 'Localhost';
|
||||
process.env.VUE_APP_CUSTOMER_PORTAL_URL = 'https://myaccountdev.safelite.com/';
|
||||
process.env.VUE_APP_GOOGLE_PLACES_API_KEY = 'AIzaSyCuLhQcDdZTTb4JzpUFms1OCch2dk5lHF0';
|
||||
process.env.VUE_APP_SAFELITE_HOP = 'https://iss-hop-dev.safelite.net/fmgCheckoutEmbedded.aspx';
|
||||
process.env.VUE_APP_SAFELITE_HOP = 'https://iss-hop-sys.glassclaim.com/fmgCheckoutShared.aspx';
|
||||
|
||||
// GA & GTM
|
||||
// NOTE: Using the old ISS site GTM Cotnainer ID for now, will create a new one soon.
|
||||
|
|
|
|||
Loading…
Reference in a new issue