CSR-365 text input and select input components.

This commit is contained in:
bmauger 2022-02-23 08:12:31 -05:00
parent 45f61fc2f1
commit c114e4b004
2 changed files with 12 additions and 11 deletions

View file

@ -38,7 +38,8 @@ export default {
color: $gray-500; color: $gray-500;
background-color: red; background-color: red;
} }
&:focus { &:focus,
&:focus-visible {
box-shadow: 0 0 0 2px $blue; box-shadow: 0 0 0 2px $blue;
} }
&:disabled, &:disabled,

View file

@ -8,7 +8,7 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<textboxQuestion <textboxQuestion
labelText="Text Input" labelText="Text Input Label"
placeholderText="Placeholder" placeholderText="Placeholder"
inputID="test-text-input" inputID="test-text-input"
/> />
@ -18,7 +18,7 @@
<div class="col"> <div class="col">
<h6 class="my-4">Disabled</h6> <h6 class="my-4">Disabled</h6>
<textboxQuestion <textboxQuestion
labelText="Text Input" labelText="Text Input Label"
placeholderText="Disabled" placeholderText="Disabled"
inputID="test-text-input" inputID="test-text-input"
isDisabled isDisabled
@ -29,7 +29,7 @@
<div class="col"> <div class="col">
<h6 class="my-4">With Error (class="has-error"):</h6> <h6 class="my-4">With Error (class="has-error"):</h6>
<textboxQuestion <textboxQuestion
labelText="Text Input" labelText="Text Input Label"
placeholderText="Placeholder" placeholderText="Placeholder"
inputID="test-text-input" inputID="test-text-input"
class="has-error" class="has-error"
@ -38,14 +38,14 @@
</div> </div>
<div class="row my-4"> <div class="row my-4">
<div class="col"> <div class="col">
<h4 class="m-0 p-2 bg-light rounded">Dropdown Input (select)</h4> <h4 class="m-0 p-2 bg-light rounded">Dropdown Input (Select)</h4>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<dropdownQuestion <dropdownQuestion
labelText="Text Input" labelText="Dropdown Label"
inputID="test-text-input" inputID="test-dropdown-input-1"
/> />
</div> </div>
</div> </div>
@ -53,8 +53,8 @@
<div class="col"> <div class="col">
<h6 class="my-4">Disabled</h6> <h6 class="my-4">Disabled</h6>
<dropdownQuestion <dropdownQuestion
labelText="Text Input" labelText="Dropdown Label"
inputID="test-text-input" inputID="test-dropdown-input-2"
isDisabled isDisabled
/> />
</div> </div>
@ -63,8 +63,8 @@
<div class="col"> <div class="col">
<h6 class="my-4">With Error (class="has-error"):</h6> <h6 class="my-4">With Error (class="has-error"):</h6>
<dropdownQuestion <dropdownQuestion
labelText="Text Input" labelText="Dropdown Label"
inputID="test-text-input" inputID="test-dropdown-input-3"
class="has-error" class="has-error"
/> />
</div> </div>