Updated alignment for the button
This commit is contained in:
sheena 2023-05-03 16:21:40 +05:30
parent ed832f740d
commit 67216a7a6f
12 changed files with 33 additions and 32 deletions

View file

@ -1,8 +1,8 @@
<template>
<footer class="footer container-fluid g-5 py-4" id="infoBox">
<footer class="footer container-fluid g-5 px-0 py-3 " id="infoBox">
<div class="row d-flex flex-row-reverse align-items-center vw-100 mx-0">
<div class="col button-col d-flex" id="stacked" >
<div class="col button-col d-flex px-0" id="stacked" >
<buttonMain
v-if="!isForwardButtonHidden"
ref="buttonMain"
@ -17,7 +17,7 @@
data-bs-dismiss="modal"
data-test-id="site-footer-main-button" />
</div>
<div v-if="!isBackButtonHidden" class="col-auto link-col py-1 text-break">
<div v-if="!isBackButtonHidden" class="col-auto link-col py-1 px-0 text-break">
<textLink
linkType="navigation"
:text="backLink"

View file

@ -7,7 +7,7 @@
<div class="container-fluid pb-2">
<div class="row px-3">
<div class="col">
<div class="select-car-form rounded">
<div class="select-car-form rounded pb-1">
<textBlock
cmsWidgetName="verifyingCoverageStatement"
typeStyle="h5"
@ -28,14 +28,15 @@
</div>
<steeringText cmsWidgetName="MASteeringText" ></steeringText>
<siteFooter
</div>
<siteFooter
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
@backClicked="navigateBack"
@forwardClicked="forwardButtonAction"
ref="siteFooter"
/>
</div>
</div>
</div>
</div>

View file

@ -3,8 +3,8 @@
<div class="page-container-grouped-styles">
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget"/>
<div class="container-fluid pb-2">
<div class="row mt-4 px-3 mb-2">
<div class="container-fluid pb-2 px-5">
<div class="row mt-4 mb-3">
<div class="col">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header"/>
<addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions-wrapper"/>

View file

@ -4,7 +4,7 @@
ref="theForm"
v-slot="{ meta }" >
<div class="page-container-grouped-styles">
<div class="fade-on-route-transition position-relative">
<div class="fade-on-route-transition position-relative px-5">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<siteSubHeader cmsWidgetName="SiteSubHeader" id="sub-header" class="mt-4"/>
<button v-on:click="forwardButtonAction">Temp Forward Button</button>

View file

@ -30,9 +30,9 @@
v-model="selectedAppointmentType"
validationRules="selection-required"
class="service-location-button-question mb-1"/>
<div class="select-car">
<div class="container-fluid pb-2">
<div class="row px-3">
<div class="select-car pt-1">
<div class="container-fluid px-0 pb-2">
<div class="row">
<div class="col">
<div class="select-car-form rounded">
<siteFooter

View file

@ -29,7 +29,7 @@
:hasRepairReplaceConflict="hasRepairReplaceConflict"
:hasSplitSingleConflict="hasSplitSingleConflict"
:selectedDamageLocations="selectedDamageLocations"
class="mb-1" />
class="mb-3" />
<alert
v-if="hasRepairReplaceConflict"
class="my-5"

View file

@ -3,13 +3,13 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" :hasBackButton="true" @click-event="backButtonAction" />
<makeQuestion class="px-4" v-model="selectedMake" ref="makeQuestion" cmsWidgetName="VehicleMakeQuestion" />
<makeQuestion v-model="selectedMake" ref="makeQuestion" cmsWidgetName="VehicleMakeQuestion" />
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>

View file

@ -3,13 +3,13 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" :hasBackButton="true" :backButtonAccessibleText="backButtonAccessibleText" @click-event="backButtonAction" />
<modelQuestion v-model="selectedModel" ref="modelQuestion" cmsWidgetName="VehicleModelQuestion" class="px-4" />
<modelQuestion v-model="selectedModel" ref="modelQuestion" cmsWidgetName="VehicleModelQuestion" />
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>

View file

@ -3,13 +3,13 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" class="mb-3" displayGenericVehicleImage />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" :hasBackButton="true" :backButtonAccessibleText="backButtonAccessibleText" @click-event="backButtonAction" />
<styleQuestion v-model="selectedStyle" ref="styleQuestion" cmsWidgetName="VehicleStyleQuestion" class="px-4" />
<styleQuestion v-model="selectedStyle" ref="styleQuestion" cmsWidgetName="VehicleStyleQuestion" />
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>

View file

@ -3,13 +3,13 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
<yearQuestion class="px-4" v-model="selectedYear" ref="yearQuestion" cmsWidgetName="VehicleYearQuestion" />
<yearQuestion v-model="selectedYear" ref="yearQuestion" cmsWidgetName="VehicleYearQuestion" />
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>

View file

@ -1,5 +1,5 @@
<template>
<div class="vin-location-information mt-2 mb-2">
<div class="vin-location-information mt-2 mb-3">
<div
class="vin-toggle"
:class="[isVinLocationDetailVisible ? 'active' : '']"

View file

@ -3,9 +3,9 @@
<div class="page-container-grouped-styles welcome">
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget"/>
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-4"/>
<div class="container-fluid pb-2">
<div class="row mt-5 px-3">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
<div class="container-fluid px-5">
<div class="row mt-4">
<div class="col">
<textboxQuestion
inputId="policyNumberField"
@ -18,7 +18,7 @@
validationRules="policy-number-required" />
</div>
</div>
<div class="row mt-4 px-3" v-if="this.displayPolicyZip">
<div class="row mt-4 " v-if="this.displayPolicyZip">
<div class="col">
<textboxQuestion
inputId="policyZipCode"
@ -27,7 +27,7 @@
ref="policyZip" />
</div>
</div>
<div class="row mt-4 px-3">
<div class="row mt-4">
<div class="col">
<textboxQuestion
type="date"
@ -48,7 +48,7 @@
<textBlock cmsWidgetName="DamageDateEstimateWidget" typeStyle="small" class="mt-2" />
</div>
</div>
<div class="row mt-4 px-3">
<div class="row mt-4">
<div class="col">
<dropdownQuestion
cmsWidgetName="DamageCauseQuestion"
@ -63,7 +63,7 @@
/>
</div>
</div>
<div class="row mt-4 px-3">
<div class="row mt-4 ">
<div class="col">
<textboxQuestion
inputId="phoneNumberField"
@ -76,7 +76,7 @@
disableAutoFill />
</div>
</div>
<div class="row mt-4 px-3">
<div class="row mt-4">
<div class="col">
<textboxQuestion
inputId="emailField"
@ -88,7 +88,7 @@
disableAutoFill />
</div>
</div>
<div class="row px-3" >
<div class="row">
<div class="col">
<textboxQuestion
class="mt-4"
@ -120,7 +120,7 @@
/>
</div>
</div>
<div class="row mb-2 ">
<div class="row mb-3">
<buttonQuestion
class="px-0 mt-4"
cmsWidgetName="GlassOnlyQuestion"