Merge branch 'develop' into feature/Digital/SSR-275

This commit is contained in:
Jeremy Zimmerman 2023-03-07 14:01:49 -05:00
commit df241cc1e7
6 changed files with 31 additions and 22 deletions

View file

@ -1,6 +1,6 @@
<template> <template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }"> <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<div class="page-container-grouped-styles overflow-auto"> <div class="page-container-grouped-styles overflow-auto vehicle-damage">
<siteHeader cmsWidgetName="SiteHeaderWidget" /> <siteHeader cmsWidgetName="SiteHeaderWidget" />
<vehicleBanner <vehicleBanner
class="mb-3" class="mb-3"

View file

@ -3,7 +3,7 @@
@submit="onSubmit" @submit="onSubmit"
@invalid-submit="onInvalidSubmit" @invalid-submit="onInvalidSubmit"
> >
<div class="page-container-grouped-styles overflow-auto"> <div class="page-container-grouped-styles overflow-auto vehicle-lookup">
<SiteHeader <SiteHeader
cms-widget-name="SiteHeaderWidget" cms-widget-name="SiteHeaderWidget"
/> />
@ -15,7 +15,7 @@
<SiteSubHeader <SiteSubHeader
cms-widget-name="SiteSubHeaderWidget" cms-widget-name="SiteSubHeaderWidget"
/> />
<div class="fade-on-route-transition sub-container make-tall"> <div class="fade-on-route-transition sub-container make-tall container gx-0">
<VinLookupMethods <VinLookupMethods
v-model="selectedVinLookupMethod" v-model="selectedVinLookupMethod"
cms-widget-name="VINLookupMethod" cms-widget-name="VINLookupMethod"

View file

@ -16,8 +16,8 @@
<siteSubHeader <siteSubHeader
cmsWidgetName="SiteSubHeaderWidget" cmsWidgetName="SiteSubHeaderWidget"
/> />
<div class="px-5"> <div class="px-4">
<div class="fade-on-route-transition sub-container make-tall mt-5"> <div class="fade-on-route-transition sub-container make-tall px-2 mt-5">
<vinLookupAlerts <vinLookupAlerts
:activeAlertType="activeVehicleLookupAlertType" :activeAlertType="activeVehicleLookupAlertType"
/> />

View file

@ -1,12 +1,12 @@
<template> <template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }" > <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }" >
<div class="page-container-grouped-styles welcome"> <div class="page-container-grouped-styles welcome">
<siteHeader cmsWidgetName="SiteHeaderWidget"/> <siteHeader cmsWidgetName="SiteHeaderWidget"/>
<div class="fade-on-route-transition h-100 overflow-auto "> <div class="fade-on-route-transition h-100 overflow-auto container">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/> <siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
<div class="row mt-4 px-5"> <div class="row mt-4 px-3">
<div class="col"> <div class="col">
<textboxQuestion <textboxQuestion
inputId="policyNumberField" inputId="policyNumberField"
@ -18,7 +18,7 @@
validationRules="policy-number-required" /> validationRules="policy-number-required" />
</div> </div>
</div> </div>
<div class="row mt-4 px-5"> <div class="row mt-4 px-3">
<div class="col"> <div class="col">
<textboxQuestion <textboxQuestion
type="date" type="date"
@ -39,7 +39,7 @@
<textBlock cmsWidgetName="DamageDateEstimateWidget" typeStyle="caption" class="mt-2" /> <textBlock cmsWidgetName="DamageDateEstimateWidget" typeStyle="caption" class="mt-2" />
</div> </div>
</div> </div>
<div class="row mt-4 px-5"> <div class="row mt-4 px-3">
<div class="col"> <div class="col">
<dropdownQuestion <dropdownQuestion
cmsWidgetName="DamageCauseQuestion" cmsWidgetName="DamageCauseQuestion"
@ -53,7 +53,7 @@
/> />
</div> </div>
</div> </div>
<div class="row mt-4 px-5"> <div class="row mt-4 px-3">
<div class="col"> <div class="col">
<textboxQuestion <textboxQuestion
inputId="damageCityField" inputId="damageCityField"
@ -65,7 +65,7 @@
validationRules="loss-city-required" /> validationRules="loss-city-required" />
</div> </div>
</div> </div>
<div class="row mt-4 px-5"> <div class="row mt-4 px-3">
<div class="col"> <div class="col">
<dropdownQuestion <dropdownQuestion
cmsWidgetName="DamageStateQuestion" cmsWidgetName="DamageStateQuestion"
@ -82,6 +82,7 @@
</div> </div>
<div class="row mt-4"> <div class="row mt-4">
<buttonQuestion <buttonQuestion
class="px-0"
cmsWidgetName="GlassOnlyQuestion" cmsWidgetName="GlassOnlyQuestion"
v-model="welcomePageModel.isDamageGlassOnly" v-model="welcomePageModel.isDamageGlassOnly"
inputId = "isDamageGlassOnly" inputId = "isDamageGlassOnly"
@ -93,7 +94,7 @@
ref="glassOnlyDamage" ref="glassOnlyDamage"
disableAutoFill/> disableAutoFill/>
</div> </div>
<div class="row mt-4 px-5"> <div class="row mt-4 px-3">
<div class="col"> <div class="col">
<textboxQuestion <textboxQuestion
inputId="phoneNumberField" inputId="phoneNumberField"
@ -106,7 +107,7 @@
disableAutoFill /> disableAutoFill />
</div> </div>
</div> </div>
<div class="row mt-4 px-5"> <div class="row mt-4 px-3">
<div class="col"> <div class="col">
<textboxQuestion <textboxQuestion
inputId="emailField" inputId="emailField"
@ -186,7 +187,7 @@
}, },
setup() { setup() {
const mainStore = useMainStore(); const mainStore = useMainStore();
// Set order account number from the issConfig. // Set order account number from the issConfig.
mainStore.order.accountNumber = mainStore.issConfig.accountNumber; mainStore.order.accountNumber = mainStore.issConfig.accountNumber;

View file

@ -159,6 +159,14 @@ html {
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 500; font-weight: 500;
} }
.vehicle-damage,
.vehicle-lookup {
.form-test-error {
margin: 0;
padding: 0 .75rem;
}
}
.form-test-invalid { .form-test-invalid {
&.btn.btn-primary { &.btn.btn-primary {

View file

@ -25,16 +25,17 @@ body {
.container-fluid { .container-fluid {
overflow: hidden; overflow: hidden;
} }
.sub-container{ .sub-container{
&.make-tall { &.make-tall {
height: 100%; height: 100%;
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
overflow-x: hidden;
} }
} }
.sr-only { .sr-only {
position: absolute; position: absolute;
left: -10000px; left: -10000px;
@ -43,11 +44,11 @@ body {
height: 1px; height: 1px;
overflow: hidden; overflow: hidden;
} }
.page-container-grouped-styles { .page-container-grouped-styles {
@extend .container-fluid, .shadow, .rounded-3, .p-0, .position-relative, .make-tall; @extend .container-fluid, .shadow, .rounded-3, .p-0, .position-relative, .make-tall;
} }
//Footer modal backdrop adjustments for positioning //Footer modal backdrop adjustments for positioning
.modal-backdrop { .modal-backdrop {
left: 50%; left: 50%;
@ -55,6 +56,5 @@ body {
max-width: 576px; max-width: 576px;
height: calc(100% - 72px); height: calc(100% - 72px);
} }
} }