diff --git a/public/css/site-2020Styling.css b/public/css/site-2020Styling.css index a605df285..e47350565 100644 --- a/public/css/site-2020Styling.css +++ b/public/css/site-2020Styling.css @@ -194,16 +194,6 @@ html .in-shop.vspacing .list-group.radio.vspacing .list-group-item { margin-bottom: 2px; } -@media (min-width: 500px) { - .form-group { - width: 80%; - } -} -@media (min-width: 800px) { - .form-group { - width: 60%; - } -} .list-group { margin-bottom: 20px; padding-left: 0; diff --git a/public/scss/site-2020Styling.scss b/public/scss/site-2020Styling.scss index ec72ae1b9..b3b4b21ce 100644 --- a/public/scss/site-2020Styling.scss +++ b/public/scss/site-2020Styling.scss @@ -188,17 +188,6 @@ margin-bottom: 2px; } - @media (min-width: 500px) { - .form-group { - width: 80%; - } - } - @media (min-width: 800px) { - .form-group { - width: 60%; - } - } - .list-group { margin-bottom: 20px; padding-left: 0; diff --git a/src/constants/progress-bar-mapper.js b/src/constants/progress-bar-mapper.js index 50b353151..f177b6cf7 100644 --- a/src/constants/progress-bar-mapper.js +++ b/src/constants/progress-bar-mapper.js @@ -1,28 +1,95 @@ -const pagePercentageMapper = { - vehicle: 4, - "vehicle-damage": 16, - estimate: 28, - "service-zip": 32, - "vin-lookup": 32, - "license-plate-lookup": 32, - "address-lookup": 32, - "address-vehicles": 36, - "part-questions": 40, - "molding-questions": 40, - "vehicle-parts": 40, - "capability-questions": 40, - quote: 48, - "insurance-company": 52, - // TODO: REMOVE THIS COMMENT AND BELOW, ONCE CASH-803 (SERVICE-LOCATION AND SCHEDULE PAGE COMBINATION) HAS BEEN VETTED - // "service-location": 60, - schedule: 64, - "mobile-details": 76, - "customer-details": 84, - "payment-method": 92, - payment: 96, - confirmation: 100, +export const pageProgressMapper = { + //Combine progress bar slide percent and button steps + vehicle: { + percent: 7, + step: 1, + }, + "vehicle-damage": { + percent: 10, + step: 1, + }, + estimate: { + percent: 14, + step: 1, + }, + "service-zip": { + percent: 18, + step: 1, + }, + "vin-lookup": { + percent: 18, + step: 1, + }, + "license-plate-lookup": { + percent: 18, + step: 1, + }, + "address-lookup": { + percent: 18, + step: 1, + }, + "address-vehicles": { + percent: 25, + step: 1, + }, + "part-questions": { + percent: 30, + step: 1, + }, + "molding-questions": { + percent: 30, + step: 1, + }, + "vehicle-parts": { + percent: 30, + step: 1, + }, + "capability-questions": { + percent: 30, + step: 1, + }, + quote: { + percent: 39, //Must be 39 + step: 2, + }, + "insurance-company": { + percent: 52, + step: 2, + }, + "service-location": { + percent: 60, + step: 2, + }, + schedule: { + percent: 70.5, //Must be 70.5 + step: 3, + }, + "mobile-details": { + percent: 76, + step: 3, + }, + "customer-details": { + percent: 84, + step: 3, + }, + "payment-method": { + percent: 92, //Must be 92 + step: 3, + }, + payment: { + percent: 96, + step: 4, + }, + confirmation: { + percent: 100, + step: 4, + }, }; export const getProgressBarPercentage = (page) => { - return pagePercentageMapper[page] || 0; + return pageProgressMapper[page]?.percent || 0; +}; + +export const getProgressBarStep = (page) => { + return pageProgressMapper[page]?.step || 1; }; diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue index 2eaf204ad..82fbf424c 100644 --- a/src/digital-components/button-question/button-question.vue +++ b/src/digital-components/button-question/button-question.vue @@ -7,7 +7,7 @@ https://safelite.atlassian.net/wiki/spaces/DC/pages/76644418/Button+Question+Com ">