CSR-241 WIP checkbox updates.
This commit is contained in:
parent
f26ab03cdb
commit
3fe95f55a9
1 changed files with 6 additions and 2 deletions
|
|
@ -1,8 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
|
<!-- Checkbox groups MUST be wrapped in a <fieldset> and <legend> tag -->
|
||||||
<div class="ui-checkbox d-flex">
|
<div class="ui-checkbox d-flex">
|
||||||
<input type="checkbox" :name="checkboxName" :id="buttonID" :tabindex="tabIndex" />
|
<input type="checkbox" aria-checked="false" :name="checkboxName" :id="buttonID" :tabindex="tabIndex" :aria-required="isRequired" />
|
||||||
<label class="d-flex align-items-center" :for="buttonID">
|
<label class="d-flex align-items-center" :for="buttonID">
|
||||||
<p v-if="checkboxLabel" class="m-0">{{checkboxLabel}}</p>
|
<p v-if="checkboxLabel" class="m-0">{{checkboxLabel}}</p>
|
||||||
|
<span v-if="screenReaderOnlyText" class="sr-only">{{screenReaderOnlyText}}</span>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -14,7 +16,9 @@ export default {
|
||||||
checkboxName: String,
|
checkboxName: String,
|
||||||
buttonID: String,
|
buttonID: String,
|
||||||
tabIndex: Number,
|
tabIndex: Number,
|
||||||
checkboxLabel: String
|
checkboxLabel: String,
|
||||||
|
screenReaderOnlyText: String,
|
||||||
|
isRequired: Boolean
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue