From cd6ace28f4a7d0df485c964d8d90c3ab4ec693ec Mon Sep 17 00:00:00 2001
From: Constantin Simonis <constantin@simonis.lol>
Date: Thu, 13 Feb 2025 10:42:39 +0100
Subject: [PATCH] style: style form

---
 .../src/app/deposit/deposit.component.html     | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/frontend/src/app/deposit/deposit.component.html b/frontend/src/app/deposit/deposit.component.html
index cac83b2..9a0be93 100644
--- a/frontend/src/app/deposit/deposit.component.html
+++ b/frontend/src/app/deposit/deposit.component.html
@@ -1,8 +1,12 @@
-<form [formGroup]="form">
-  @if (errorMsg) {
-    <div>{{ errorMsg }}</div>
-  }
-  <input type="number" formControlName="amount" />€
-  <br />
-  <button type="button" (click)="submit()">Einzahlen</button>
+<form [formGroup]="form" class="max-w-md mx-auto p-4 bg-white shadow-md rounded-lg">
+  <div *ngIf="errorMsg" class="mb-4 text-red-500">
+    {{ errorMsg }}
+  </div>
+  <div class="mb-4">
+    <label for="amount" class="block text-sm font-medium text-gray-700">Betrag</label>
+    <input type="number" id="amount" formControlName="amount" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm text-black bg-white" />
+  </div>
+  <button type="button" (click)="submit()" class="w-full bg-indigo-600 text-white py-2 px-4 rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+    Einzahlen
+  </button>
 </form>