CSR-1810 add "edit zip code" copy for screen reader

This commit is contained in:
Bryan Mauger 2023-11-20 14:08:01 -05:00
parent 75a98999d7
commit 8fcc228439
2 changed files with 10 additions and 1 deletions

View file

@ -12,6 +12,7 @@
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="mt-5" /> <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="mt-5" />
<serviceZipModalQuestion <serviceZipModalQuestion
editScreenReaderTextCmsWidgetName="ScreenReaderZipEditWidget"
v-model="serviceZipCodeQuestion" v-model="serviceZipCodeQuestion"
ref="serviceZipCodeQuestion" ref="serviceZipCodeQuestion"
:mobileFeePart="mobileFeePart" :mobileFeePart="mobileFeePart"

View file

@ -6,7 +6,11 @@
linkType="text" linkType="text"
:text="serviceZipLinkText" :text="serviceZipLinkText"
href="#!" href="#!"
@click-event="openModal" /> @click-event="openModal">
<template v-slot:after-text v-if="editScreenReaderTextCmsWidgetName">
<span class="sr-only"> {{ screenReaderOnlyText }} </span>
</template>
</textLink>
</div> </div>
</div> </div>
<modal <modal
@ -68,8 +72,12 @@ export default {
}, },
linkWidgetName: String, linkWidgetName: String,
modalWidgetName: String, modalWidgetName: String,
editScreenReaderTextCmsWidgetName: String,
}, },
computed: { computed: {
screenReaderOnlyText() {
return this.getCmsContent(this.editScreenReaderTextCmsWidgetName, "Text");
},
serviceZipLinkText() { serviceZipLinkText() {
if (this.modelValue.zipCode && this.modelValue.zipCode.length > 0) { if (this.modelValue.zipCode && this.modelValue.zipCode.length > 0) {
return this.modelValue.state + ", " + this.modelValue.zipCode; return this.modelValue.state + ", " + this.modelValue.zipCode;