Merge pull request #2143 from Safelite/CSR-2383-fix-collapsed-cart-on-confirm

Csr 2383 fix collapsed cart on confirm

src/layouts/confirmation/confirmation.vue

@@ -111,6 +111,8 @@ import { containsRecalParts } from "@/helpers/recal-helper.js";
 export default {
     name: "confirmation",
     async beforeRouteEnter(to, from, next) {
+        const hasRecalPriceRemoveExperiment = await store.getters.shouldHideRecalibration;
+
         await baseMixin.methods.dispatchStoreAction(storeActions.CREATE_SUBMITTED_ORDER); // This nulls the Store order
 
         // Call APIs
@@ -155,10 +157,6 @@ export default {
         const isNoComp = submittedOrder?.policy?.isNoComp;
         const isItac = submittedOrder?.policy?.isItac;
         const isRecalibrationOnOrder = containsRecalParts(lineItemsFromSubmittedOrder);
-        const hasRecalPriceRemoveExperiment =
-            experimentMixin.methods
-                .getSettingValue(experimentSettings.RECAL_PRICE_REMOVE)
-                ?.toLowerCase() === "true";
 
         const shouldHideRecalibration = () => {
             if (isNoComp || isItac) {

src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue

@@ -276,11 +276,16 @@ export default {
                 max-height: 500px;
             }
 
+            .row {
+                align-items: center;
+            }
+
             p {
                 font-weight: 600;
                 display: flex;
                 justify-content: space-between;
                 align-items: center;
+                white-space: nowrap;
                 span {
                     &.pricing-info {
                         color: $green;

src/styles/common-styles.scss

@@ -10,7 +10,7 @@ body {
             overflow-x: unset;
         }
         &.page-container-grouped-styles {
-            height: 100vh;
+            height: 100dvh;
             display: flex;
             flex-direction: column;
         }
@@ -68,6 +68,18 @@ body {
         height: 1px;
         overflow: hidden;
     }
+
+    // Fix "iOS viewport scroll bug" issue on iPhone
+    // where bottom of page is covered by address bar
+    @media only screen 
+        and (min-device-width: 375px) 
+        and (max-device-width: 812px) 
+        and (-webkit-min-device-pixel-ratio: 3)
+        and (orientation: portrait) { 
+        .page-container-grouped-styles {                           
+            padding-bottom: 3rem;                         
+        }   
+    } 
 }
 .modal-open {
     .container-fluid {