From 7c08ddacb7d22b906a75ad331d7ca48bfef9155b Mon Sep 17 00:00:00 2001
From: Jan Bader <jan@javil.eu>
Date: Tue, 1 Mar 2022 20:11:41 +0000
Subject: [PATCH] Remove widths from TransactionInputRow and use Button

---
 web/src/components/TransactionInputRow.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/web/src/components/TransactionInputRow.vue b/web/src/components/TransactionInputRow.vue
index 9eb3da8..1a1d8e8 100644
--- a/web/src/components/TransactionInputRow.vue
+++ b/web/src/components/TransactionInputRow.vue
@@ -3,6 +3,7 @@ import { computed, ref } from "vue";
 import Autocomplete from '../components/Autocomplete.vue'
 import { Transaction, useTransactionsStore } from "../stores/transactions";
 import DateInput from "./DateInput.vue";
+import Button from "./Button.vue";
 
 const props = defineProps<{
     budgetid: string
@@ -51,28 +52,27 @@ function saveTransaction(e: MouseEvent) {
 
 <template>
     <tr>
-        <td style="width: 90px;" class="text-sm">
+        <td class="text-sm">
             <DateInput class="border-b-2 border-black" v-model="TX.Date" />
         </td>
-        <td style="max-width: 150px;">
+        <td>
             <Autocomplete v-model:text="TX.Payee" v-model:id="TX.PayeeID" v-model:type="payeeType" model="payees" />
         </td>
-        <td style="max-width: 200px;">
+        <td>
             <Autocomplete v-model:text="TX.Category" v-model:id="TX.CategoryID" model="categories" />
         </td>
         <td>
             <input class="block w-full border-b-2 border-black" type="text" v-model="TX.Memo" />
         </td>
-        <td style="width: 80px;" class="text-right">
+        <td class="text-right">
             <input
                 class="text-right block w-full border-b-2 border-black"
                 type="currency"
                 v-model="TX.Amount"
             />
         </td>
-        <td style="width: 20px;">
-            <input type="submit" @click="saveTransaction" value="Save" />
+        <td>
+            <Button class="bg-blue-500" @click="saveTransaction">Save</Button>
         </td>
-        <td style="width: 20px;"></td>
     </tr>
 </template>
\ No newline at end of file