diff --git a/resources/assets/vue/components/bookings/forms/BookingPaymentQuotationComponent.vue b/resources/assets/vue/components/bookings/forms/BookingPaymentQuotationComponent.vue
index 4652656b..524826ba 100644
--- a/resources/assets/vue/components/bookings/forms/BookingPaymentQuotationComponent.vue
+++ b/resources/assets/vue/components/bookings/forms/BookingPaymentQuotationComponent.vue
@@ -70,9 +70,9 @@
                                     <div class="font-heading all-caps fs-10">Transfer Total:</div>
                                 </div>
                                 <div class="col-auto text-right">
-                                    <div class="font-heading fs-12 requestModal" data-type="editBookingAmount">{{this.data.fixed_currency.short_code}} {{(Math.round((this.data.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
+                                    <div class="font-heading fs-12"><i class="fa fa-edit fs-12 pointer fa-fw requestModal" data-type="editBookingAmount"></i> {{this.data.fixed_currency.short_code}} {{(Math.round((this.data.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
                                 </div>
-                                <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="stick-up" type="editBookingAmount">
+                                <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="editBookingAmount">
                                     <edit-booking-amount-form-component :data="{name: $store.getters.getUserName}" :section="section"></edit-booking-amount-form-component>
                                 </modal-component>
                             </div>
diff --git a/resources/assets/vue/components/bookings/forms/EditBookingAmountFormComponent.vue b/resources/assets/vue/components/bookings/forms/EditBookingAmountFormComponent.vue
index 3165bbc3..2a1cd75b 100644
--- a/resources/assets/vue/components/bookings/forms/EditBookingAmountFormComponent.vue
+++ b/resources/assets/vue/components/bookings/forms/EditBookingAmountFormComponent.vue
@@ -10,9 +10,9 @@
                     </div>
                     <div class="row m-b-10">
                         <div class="col">
-                            <div class="fs-12 text-black">Booking Amount</div>
-                            <validation-wrapper-component :validator="$v.parameters.name">
-                                <input type="text" class="form-control" v-model="parameters.name">
+                            <validation-wrapper-component :validator="$v.parameters.bookingAmount">
+                                <label class="muted">Booking Amount</label>
+                                <input type="text" class="form-control" v-model="parameters.bookingAmount">
                             </validation-wrapper-component>
                         </div>
                     </div>
@@ -36,16 +36,22 @@
 </template>
 <script>
     import updateProfileFormValidation from '../../../general/mixins/accounts/validation/updateProfileFormValidation';
+    import { required } from "vuelidate/lib/validators";
+    // import updateProfileHandler from "../updateProfileHandler";
     export default {
         data(){
             return {
                 error: '',
                 parameters: {
-                    name: ''
+                    bookingAmount: ''
                 }
             }
         },
-        mixins: [updateProfileFormValidation]
-
+        validations: {
+            parameters: {
+                bookingAmount: { required },
+            }
+        },
+        // mixins: [updateProfileFormValidation]
     }
 </script>
\ No newline at end of file