Fix validation icon and spacing
This commit is contained in:
parent
f50beae754
commit
f1f344388a
@ -84,8 +84,9 @@
|
|||||||
margin: 0 $gap 0 0;
|
margin: 0 $gap 0 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
span.icon.icon--ok.icon-validation {
|
.usa-input--validation--dollars label span.icon.icon--ok.icon-validation {
|
||||||
left: 47.5em;
|
left: auto;
|
||||||
|
right: -$gap * 9;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-row {
|
.form-row {
|
||||||
|
@ -200,6 +200,11 @@
|
|||||||
{{ Icon("ok", classes="icon--green") }}
|
{{ Icon("ok", classes="icon--green") }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<p class="usa-input-error-message" v-bind:class="{ 'form-has-errors': !isWithinDateRange }">
|
||||||
|
{% if maxdate and mindate %}Date must be between {{mindate.strftime("%m/%d/%Y")}} and {{maxdate.strftime("%m/%d/%Y")}}{% endif %}
|
||||||
|
{% if maxdate and not mindate %}Date must be before or on {{maxdate.strftime("%m/%d/%Y")}}{% endif %}
|
||||||
|
{% if mindate and not maxdate %}Date must be after or on {{mindate.strftime("%m/%d/%Y")}}{% endif %}
|
||||||
|
</p>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
</date-selector>
|
</date-selector>
|
||||||
</div>
|
</div>
|
||||||
@ -259,6 +264,11 @@
|
|||||||
{{ Icon("ok", classes="icon--green") }}
|
{{ Icon("ok", classes="icon--green") }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<p class="usa-input-error-message" v-bind:class="{ 'form-has-errors': !isWithinDateRange }">
|
||||||
|
{% if maxdate and mindate %}Date must be between {{mindate.strftime("%m/%d/%Y")}} and {{maxdate.strftime("%m/%d/%Y")}}{% endif %}
|
||||||
|
{% if maxdate and not mindate %}Date must be before or on {{maxdate.strftime("%m/%d/%Y")}}{% endif %}
|
||||||
|
{% if mindate and not maxdate %}Date must be after or on {{mindate.strftime("%m/%d/%Y")}}{% endif %}
|
||||||
|
</p>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
</date-selector>
|
</date-selector>
|
||||||
</div>
|
</div>
|
||||||
@ -274,7 +284,7 @@
|
|||||||
:name="'clins-' + clinIndex + '-obligated_amount'"
|
:name="'clins-' + clinIndex + '-obligated_amount'"
|
||||||
validation="dollars"
|
validation="dollars"
|
||||||
:watch='true'>
|
:watch='true'>
|
||||||
<div class="usa-input usa-input--validation--dollars noMaxWidth">
|
<div class="usa-input usa-input--validation--dollars">
|
||||||
<label :for="name">
|
<label :for="name">
|
||||||
<div class="usa-input__title">{{ 'task_orders.form.obligated_funds_label' | translate }}</div>
|
<div class="usa-input__title">{{ 'task_orders.form.obligated_funds_label' | translate }}</div>
|
||||||
<span v-show='showError'>{{ Icon('alert',classes="icon-validation") }}</span>
|
<span v-show='showError'>{{ Icon('alert',classes="icon-validation") }}</span>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user