Merge branch 'develop' into feature/csr-1465

src/digital-components/button-question/button-question.vue

@@ -72,7 +72,10 @@ https://safelite.atlassian.net/wiki/spaces/DC/pages/76644418/Button+Question+Com
                 </div>
             </fieldset>
         </div>
-        <div class="row form-test-error">
+        <div
+            id="form-test-error"
+            class="row form-test-error"
+            :class="isErrorCentered ? 'text-center' : ''">
             <error-message
                 role="comment"
                 aria-atomic="true"
@@ -227,8 +230,18 @@ export default {
                 classes += " two-list-card-width";
             }
 
+            if (this.buttonTypeString == "listCard" && this.buttonsInfo.length === 1) {
+                classes += " one-list-card-width";
+            }
+
             return classes;
         },
+        isErrorCentered() {
+            if (this.buttonTypeString == "listCard" && this.buttonsInfo.length <= 2) {
+                return true;
+            }
+            return false;
+        },
         buttonsInfo() {
             return (Array.isArray(this.answers) ? this.answers : [])?.map((answer) => ({
                 buttonLabel: answer.buttonLabel ?? answer.Text ?? answer,

src/fmg-components/add-vaps-modal-buttons/add-vaps-modal-buttons.vue

@@ -59,7 +59,7 @@ export default {
                 return item.partType === "RAIN DEFENSE";
             });
 
-            const price = lineItem.laborAmount + lineItem.sellingPrice + lineItem.kitPrice;
+            const price = lineItem?.laborAmount + lineItem?.sellingPrice + lineItem?.kitPrice;
             return parseFloat(price).toFixed(2);
         },
         wipersPrice() {
@@ -68,7 +68,7 @@ export default {
                 return item.partType.includes(" WIPER");
             });
             lineItems?.forEach((item) => {
-                price += item.laborAmount + item.sellingPrice + item.kitPrice;
+                price += item?.laborAmount + item?.sellingPrice + item?.kitPrice;
             });
             return parseFloat(price).toFixed(2);
         },
@@ -87,12 +87,12 @@ export default {
             };
 
             if (this.showAddWipers) {
-                const answer = getAnswer("ADD WIPER BLADES", this.answersCmsData);
+                const answer = getAnswer("WipersModal", this.answersCmsData);
                 answer.SubText = "+$" + this.wipersPrice;
                 answers.push(answer);
             }
             if (this.showAddRainDefense) {
-                const answer = getAnswer("ADD RAIN DEFENSE", this.answersCmsData);
+                const answer = getAnswer("RainDefenseModal", this.answersCmsData);
                 answer.SubText = "+$" + this.rainDefensePrice;
                 answers.push(answer);
             }

src/layouts/payment-method/payment-method.vue

@@ -14,7 +14,7 @@
                         :displayGenericVehicleImage="false" />
 
                     <funnelSubHeader
-                        class="mb-5"
+                        class="mb-5 mt-4"
                         cmsWidgetName="FunnelSubHeaderWidget"
                         leftAlignHeader />
 
@@ -111,7 +111,6 @@ export default {
             null,
             "payment-method"
         );
-        console.log("rainDefensePromise: ", rainDefensePromise);
 
         const supportingItemsPromise = baseMixin.methods.dispatchStoreActionWithLogging(
             storeActions.GET_SUPPORTING_ITEMS,

src/layouts/payment/payment.vue

@@ -51,14 +51,8 @@
         <input type="hidden" name="sgNoKeystrokeProcessing" value="false" />
 
         <input type="hidden" name="maskCharacter" value="*" />
-        <input
-            type="hidden"
-            name="styleSheetCode"
-            value="https://fixmyglasstest.safelite.com/FixMyGlass/css/experiments/site-2020Styling.css" />
-        <input
-            type="hidden"
-            name="styleSheetCode2"
-            value="https://fixmyglasstest.safelite.com/FixMyGlass/css/experiments/SLHop-2020Styling.css" />
+        <input type="hidden" name="styleSheetCode" :value="dynamicCSSUrl" />
+        <input type="hidden" name="styleSheetCode2" :value="dynamicCSSUrl" />
 
         <input
             type="hidden"
@@ -244,6 +238,12 @@ export default {
             vm.fetchSignatureInfo();
         });
     },
+    computed: {
+        dynamicCSSUrl() {
+            const { protocol, hostname, port } = window.location;
+            return `${protocol}//${hostname}:${port}/css/site-2020Styling.css`;
+        },
+    },
     methods: {
         arePagePrerequisitesValid() {
             // TODO

src/styles/common-styles.scss

@@ -23,6 +23,12 @@ body {
             }
             .col {
                 max-width: 236px;
+                &.one-list-card-width {
+                    max-width: 472px;
+                    @include media-breakpoint-up(xl) {
+                        max-width: 66.6666666%;
+                    }
+                }
             }
         }
         .col-xl-4 {