jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

CSR-254: additional tweaks

Browse source
This commit is contained in:
Adam Caouette 2022-01-14 10:11:19 -05:00
parent 349c59b7dd
commit 5a8f2f4526
3 changed files with 12 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
src/layouts/form-test/form-test.vue
View file

@ -21,12 +21,11 @@
</h4> </h4>
<listButtonHorizontal <listButtonHorizontal
groupName="demo" groupName="demo"
aria-required="true"
buttonID="1" buttonID="1"
value="1" value="1"
buttonLabelSubCopy="" buttonLabelSubCopy=""
textPosition="text-center" textPosition="text-center"
loaderColor="blue"
loaderPosition="right"
sizeInRem="1" sizeInRem="1"
:totalInGroup="3" :totalInGroup="3"
:positionInGroup="1" :positionInGroup="1"
@ -34,12 +33,11 @@
/> />
<listButtonHorizontal <listButtonHorizontal
groupName="demo" groupName="demo"
aria-required="true"
buttonID="2" buttonID="2"
value="2" value="2"
buttonLabelSubCopy="" buttonLabelSubCopy=""
textPosition="text-center" textPosition="text-center"
loaderColor="blue"
loaderPosition="right"
sizeInRem="1" sizeInRem="1"
:totalInGroup="3" :totalInGroup="3"
:positionInGroup="2" :positionInGroup="2"
@ -47,12 +45,11 @@
/> />
<listButtonHorizontal <listButtonHorizontal
groupName="demo" groupName="demo"
aria-required="true"
buttonID="3" buttonID="3"
value="3" value="3"
buttonLabelSubCopy="" buttonLabelSubCopy=""
textPosition="text-center" textPosition="text-center"
loaderColor="blue"
loaderPosition="right"
sizeInRem="1" sizeInRem="1"
:totalInGroup="3" :totalInGroup="3"
:positionInGroup="3" :positionInGroup="3"
@ -131,10 +128,10 @@
<h4 class="mx-2 mt-4 mb-0">demo5: Where's your damage? (Required)</h4> <h4 class="mx-2 mt-4 mb-0">demo5: Where's your damage? (Required)</h4>
<div <div
role="radiogroup" role="radiogroup"
aria-labelledby="demo-group" aria-labelledby="demo5-group"
class="d-flex flex-row p-0" class="d-flex flex-row p-0"
> >
<h4 class="sr-only" id="demo-group"> <h4 class="sr-only" id="demo5-group">
Where's your damage? Where's your damage?
</h4> </h4>
<listCard <listCard
@ -175,10 +172,10 @@
<h4 class="mx-2 mt-4 mb-0">demo6: What's your windshield damage? (Required if demo5 "Windshield" is selected)</h4> <h4 class="mx-2 mt-4 mb-0">demo6: What's your windshield damage? (Required if demo5 "Windshield" is selected)</h4>
<div <div
role="radiogroup" role="radiogroup"
aria-labelledby="demo-group" aria-labelledby="demo6-group"
class="d-flex flex-row p-0" class="d-flex flex-row p-0"
> >
<h4 class="sr-only" id="demo-group"> <h4 class="sr-only" id="demo6-group">
What's your windshield damage? What's your windshield damage?
</h4> </h4>
<listCard <listCard

5
src/ux-components/list-button-horizontal/list-button-horizontal.vue
View file

@ -15,7 +15,6 @@
/> />
<label <label
tabindex="-1" tabindex="-1"
aria-checked="false"
:for="buttonID" :for="buttonID"
:aria-labelledby="buttonID" :aria-labelledby="buttonID"
class="d-flex flex-column justify-content-center py-3 px-4" class="d-flex flex-column justify-content-center py-3 px-4"
@ -36,13 +35,12 @@
:id="buttonID" :id="buttonID"
:name="groupName" :name="groupName"
:value="buttonID" :value="buttonID"
aria-required="true" :aria-required="isRequired"
@click="handleClick(value)" @click="handleClick(value)"
:data-focus-target="groupName" :data-focus-target="groupName"
/> />
<label <label
tabindex="-1" tabindex="-1"
aria-checked="false"
:for="buttonID" :for="buttonID"
:aria-labelledby="buttonID" :aria-labelledby="buttonID"
class="d-flex flex-column justify-content-center py-3 px-4" class="d-flex flex-column justify-content-center py-3 px-4"
@ -84,7 +82,6 @@ export default {
}, },
data() { data() {
return { return {
hasError: false,
isLoaderDisplayed: false, isLoaderDisplayed: false,
}; };
}, },

8
src/ux-components/list-card/list-card.vue
View file

@ -13,7 +13,7 @@
<label <label
:for="buttonID" :for="buttonID"
class="d-flex flex-column w-100 align-items-center pt-4 pb-2" class="d-flex flex-column w-100 align-items-center pt-4 pb-2"
tabindex="1" tabindex="-1"
> >
<img class="order-1" v-bind:src="require(`@/assets/img/icons/${buttonImage}`)" v-bind:alt="altText" /> <img class="order-1" v-bind:src="require(`@/assets/img/icons/${buttonImage}`)" v-bind:alt="altText" />
<p class="small m-0 order-3">{{buttonLabel}}</p> <p class="small m-0 order-3">{{buttonLabel}}</p>
@ -33,7 +33,7 @@
<label <label
:for="buttonID" :for="buttonID"
class="d-flex flex-column w-100 align-items-center pt-4 pb-2" class="d-flex flex-column w-100 align-items-center pt-4 pb-2"
tabindex="1" tabindex="-1"
> >
<img class="order-1" v-bind:src="require(`@/assets/img/icons/${buttonImage}`)" v-bind:alt="altText" /> <img class="order-1" v-bind:src="require(`@/assets/img/icons/${buttonImage}`)" v-bind:alt="altText" />
<p class="small mt-2 mb-0 order-2">{{buttonLabel}}</p> <p class="small mt-2 mb-0 order-2">{{buttonLabel}}</p>
@ -53,7 +53,7 @@
<label <label
:for="buttonID" :for="buttonID"
class="d-flex flex-row w-100 align-items-center py-3 ps-3 pe-8" class="d-flex flex-row w-100 align-items-center py-3 ps-3 pe-8"
tabindex="1" tabindex="-1"
:class="{'checkboxTop': buttonLabelSubCopy}" :class="{'checkboxTop': buttonLabelSubCopy}"
> >
<img class="ms-auto order-3" v-bind:src="require(`@/assets/img/icons/${buttonImage}`)" v-bind:alt="altText" /> <img class="ms-auto order-3" v-bind:src="require(`@/assets/img/icons/${buttonImage}`)" v-bind:alt="altText" />
@ -76,7 +76,7 @@
<label <label
:for="buttonID" :for="buttonID"
class="d-flex flex-row w-100 align-items-center py-3 ps-3 pe-8" class="d-flex flex-row w-100 align-items-center py-3 ps-3 pe-8"
tabindex="1" tabindex="-1"
:class="{'checkboxTop': buttonLabelSubCopy}" :class="{'checkboxTop': buttonLabelSubCopy}"
> >
<img class="ms-auto order-3" v-bind:src="require(`@/assets/img/icons/${buttonImage}`)" v-bind:alt="altText" /> <img class="ms-auto order-3" v-bind:src="require(`@/assets/img/icons/${buttonImage}`)" v-bind:alt="altText" />