DigitalConsumer.FixMyGlass/src/ux-components/list-button/list-button.vue

28 lines
759 B
Vue

<template>
<div class="list-group list-button d-flex flex-column w-100 mb-2">
<input type="checkbox" id="buttonID" name="groupName" value="buttonID" aria-required="isRequired">
<label tabindex="1" for="buttonID" aria-labelledby="buttonID" class="d-flex flex-column justify-content-center py-3 px-4">
<span class="m-0">Button ID</span>
<span class="m-0 small">Button Label Subcopy</span>
<span class="sr-only">Screenreader Text</span>
</label>
</div>
</template>
<script>
export default {
name: "listButton",
};
</script>
<style lang="scss">
.list-group {
&.list-button {
input[type="radio"],
input[type="checkbox"] {
position: static !important; //override bootstrap
height: 0;
}
}
}
</style>