Skip to content

Commit

Permalink
Highlight custom amount field when it is used
Browse files Browse the repository at this point in the history
- use the "active" status and keep the field highlighted to let the user now
the input is used

https://phabricator.wikimedia.org/T375380
  • Loading branch information
moiikana committed Sep 23, 2024
1 parent c419bb0 commit 4a287ee
Showing 1 changed file with 1 addition and 2 deletions.
3 changes: 1 addition & 2 deletions src/components/shared/form_fields/AmountField.vue
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@

<div class="form-field-amount-custom" :class="{ active: isCustomAmount }">
<label class="form-field-amount-help-text" for="amount-custom">{{ $t('donation_form_payment_amount_label') }}</label>
<div class="form-field-amount-custom-euro-symbol">
<div class="form-field-amount-custom-euro-symbol" :class="{ active: isCustomAmount }">
<TextFormInput
v-model="customAmount"
input-type="text"
Expand Down Expand Up @@ -238,7 +238,6 @@ $input-height: 50px;
&.active {
input {
border-color: colors.$primary;
box-shadow: 0 1px 0 0 colors.$primary;
}
}
Expand Down

0 comments on commit 4a287ee

Please sign in to comment.