From 4a287ee5667c9da0e6461fc840f0636c1e0d3df0 Mon Sep 17 00:00:00 2001
From: Corinna Hillebrand <corinna.hillebrand@wikimedia.de>
Date: Mon, 23 Sep 2024 14:30:39 +0200
Subject: [PATCH] Highlight custom amount field when it is used

- use the "active" status and keep the field highlighted to let the user now
the input is used

https://phabricator.wikimedia.org/T375380
---
 src/components/shared/form_fields/AmountField.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/shared/form_fields/AmountField.vue b/src/components/shared/form_fields/AmountField.vue
index d82b1ed84..ceebdc806 100644
--- a/src/components/shared/form_fields/AmountField.vue
+++ b/src/components/shared/form_fields/AmountField.vue
@@ -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"
@@ -238,7 +238,6 @@ $input-height: 50px;
 		&.active {
 			input {
 				border-color: colors.$primary;
-				box-shadow: 0 1px 0 0 colors.$primary;
 			}
 		}