Merge branch 'develop' into feature/digital/SSR-254

This commit is contained in:
Kroell 2023-03-09 11:05:28 -05:00
commit 2d73c30c4d
7 changed files with 231 additions and 205 deletions

View file

@ -32,7 +32,7 @@ const errorMessages = {
LOSS_CAUSE_REQUIRED: "Please enter loss cause", LOSS_CAUSE_REQUIRED: "Please enter loss cause",
LOSS_CITY_REQUIRED: "Please enter a city", LOSS_CITY_REQUIRED: "Please enter a city",
LOSS_STATE_REQUIRED: "Please select an option", LOSS_STATE_REQUIRED: "Please select an option",
LOSS_DATE_REQUIRED: "Please enter a loss date", LOSS_DATE_REQUIRED: "Please select a date. Format must be MM/DD/YYYY and the date must be not in the future",
DAMAGE_OPTION_REQUIRED: "Please select an option", DAMAGE_OPTION_REQUIRED: "Please select an option",
POLICYHOLDER_FIRST_NAME_REQUIRED: "Please enter the policyholder first name", POLICYHOLDER_FIRST_NAME_REQUIRED: "Please enter the policyholder first name",

View file

@ -67,7 +67,7 @@
</div> </div>
</fieldset> </fieldset>
</div> </div>
<div class="row form-test-error mt-1"> <div class="row form-test-error mt-1 px-5">
<error-message <error-message
:name="formatString(groupName)" :name="formatString(groupName)"
v-if="!suppressError"></error-message> v-if="!suppressError"></error-message>

View file

@ -229,6 +229,17 @@ input[type="date"]::-webkit-calendar-picker-indicator {
color: $black; color: $black;
font-weight: 500; font-weight: 500;
} }
span{
font-weight:400;
font-size:14px;
color: #4D5151;
}
.form-test-error span{
color: #d4281c;
font-size: 0.875rem;
font-weight: 500;
}
.input-wrapper { .input-wrapper {
position: relative; position: relative;
&.has-search-icon { &.has-search-icon {

View file

@ -56,12 +56,12 @@ describe("menu-modal.vue", () => {
expect(icon.attributes('alt')).toBe('Your privacy choices'); expect(icon.attributes('alt')).toBe('Your privacy choices');
}); });
it("Should returnDo not sell my information text link text", async () => { it("Should return Warranty text link text", async () => {
// Act // Act
const wrapper = shallowMount(menuModal); const wrapper = shallowMount(menuModal);
// Expect // Expect
expect(wrapper.html()).toContain("Do not sell my information"); expect(wrapper.html()).toContain("Warranty");
}); });
}); });

View file

@ -27,35 +27,46 @@
<h5 class="modal-title" id="footerModalLabel">Footer Navigation</h5> <h5 class="modal-title" id="footerModalLabel">Footer Navigation</h5>
</div> </div>
<div class="modal-body d-flex flex-column"> <div class="modal-body d-flex flex-column">
<textLink linkType="navigation" text="Terms of use" href="https://www.safelite.com/terms-of-use" target="_blank" /> <textLink
linkType="navigation"
text="Terms of use"
href="//www.safelite.com/terms-of-use"
target="_blank" />
<textLink <textLink
linkType="navigation" linkType="navigation"
text="Your privacy choices" text="Your privacy choices"
href="//www.safelite.com/privacy-center" href="//www.safelite.com/privacy-center"
target="_blank" target="_blank">
>
<template v-slot:after-text> <template v-slot:after-text>
<img <img
class="ccpa-icon" class="ccpa-icon"
src="~@/assets/img/icons/ccpa-icon.svg"
alt="Your privacy choices"
data-id="ccpa-icon" data-id="ccpa-icon"
/> src="~@/assets/img/icons/ccpa-icon.svg"
alt="Your privacy choices" />
</template> </template>
</textLink> </textLink>
<textLink linkType="navigation" text="Do not sell my information" href="https://privacyportal-cdn.onetrust.com/dsarwebform/d3b95a93-e22e-4d4d-a806-482052406557/9e371601-eae3-4338-9430-b90b9036022b.html" target="_blank" /> <textLink
linkType="navigation"
text="Warranty"
href="//www.safelite.com/national-lifetime-warranty"
target="_blank" />
<textLink
linkType="navigation"
text="Notice at collection"
href="https://privacyportal-cdn.onetrust.com/dsarwebform/d3b95a93-e22e-4d4d-a806-482052406557/9e371601-eae3-4338-9430-b90b9036022b.html"
target="_blank" />
</div> </div>
<div class="modal-footer d-flex justify-content-start"> <div class="modal-footer d-flex justify-content-start">
&copy; {{new Date().getFullYear()}} Safelite Group &copy; {{new Date().getFullYear()}} Safelite Group
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import textLink from "@/ux-components/text-link/text-link"; import textLink from "@/ux-components/text-link/text-link";
export default { export default {
name: 'menuModal', name: 'menuModal',
data() { data() {
return { return {
@ -79,11 +90,11 @@
components: { components: {
textLink, textLink,
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.menu-modal-container { .menu-modal-container {
position: absolute; position: absolute;
padding: 1.47rem 1rem 1.47rem 1.47rem; padding: 1.47rem 1rem 1.47rem 1.47rem;
right: 0; right: 0;
@ -120,8 +131,8 @@
} }
} }
} }
} }
.modal { .modal {
&.menu-modal { &.menu-modal {
max-width: 576px; max-width: 576px;
left: auto; left: auto;
@ -164,6 +175,7 @@
background-color: $white; background-color: $white;
position: relative; position: relative;
right: -.5rem; right: -.5rem;
top: .5rem;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
@ -193,5 +205,5 @@
} }
//.modal-backdrop styles are in common-styles.scss //.modal-backdrop styles are in common-styles.scss
} }
} }
</style> </style>

View file

@ -21,7 +21,7 @@ import alert from "@/ux-components/alert/alert";
import eventBus from "@/helpers/event-bus/event-bus"; import eventBus from "@/helpers/event-bus/event-bus";
import { globalEvents } from "@/constants/events"; import { globalEvents } from "@/constants/events";
export default({ export default({
name: "siteHeader", name: "siteHeader",
data() { data() {
return { return {
@ -84,15 +84,18 @@ import { globalEvents } from "@/constants/events";
alert alert
}, },
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.alert { .site-header {
height: 72px;
}
.alert {
left: 0; left: 0;
top: 72px; top: 72px;
} }
#siteHeaderImage { #siteHeaderImage {
height: 2.5rem; height: 2.5rem;
} }
</style> </style>

View file

@ -48,7 +48,7 @@
inputId="damageCauseQuestionField" inputId="damageCauseQuestionField"
:options="DamageCauseOptions" :options="DamageCauseOptions"
disableAutoFill disableAutoFill
validationRules="loss-cause-required" validationRules="damage-option-required"
placeHolderText="Select an option" placeHolderText="Select an option"
/> />
</div> </div>
@ -159,7 +159,7 @@
defineRule("loss-date-required", required(errorMessages.LOSS_DATE_REQUIRED)); defineRule("loss-date-required", required(errorMessages.LOSS_DATE_REQUIRED));
defineRule("loss-state-required", required(errorMessages.LOSS_STATE_REQUIRED)); defineRule("loss-state-required", required(errorMessages.LOSS_STATE_REQUIRED));
defineRule("loss-city-required", required(errorMessages.LOSS_CITY_REQUIRED)); defineRule("loss-city-required", required(errorMessages.LOSS_CITY_REQUIRED));
defineRule("phone-number-required", required(errorMessages.PHONE_NUMBER_REQUIRED)); defineRule("phone-number-required", required(errorMessages.PHONE_NUMBER_FORMAT));
defineRule("email-address-required", required(errorMessages.EMAIL_ADDRESS_REQUIRED)); defineRule("email-address-required", required(errorMessages.EMAIL_ADDRESS_REQUIRED));
defineRule("damage-option-required", required(errorMessages.DAMAGE_OPTION_REQUIRED)); defineRule("damage-option-required", required(errorMessages.DAMAGE_OPTION_REQUIRED));