From 3fc290ecd1f046b8b09bd636c868080e4d892d39 Mon Sep 17 00:00:00 2001
From: Phan Huy Tran <p.tran@neusta.de>
Date: Thu, 13 Feb 2025 11:56:14 +0100
Subject: [PATCH] feat: Add basic styling

---
 frontend/src/app/feature/deposit/deposit.component.html | 9 +++++----
 frontend/src/app/feature/deposit/deposit.component.ts   | 3 ++-
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/frontend/src/app/feature/deposit/deposit.component.html b/frontend/src/app/feature/deposit/deposit.component.html
index 79ac16d..78c7a07 100644
--- a/frontend/src/app/feature/deposit/deposit.component.html
+++ b/frontend/src/app/feature/deposit/deposit.component.html
@@ -1,20 +1,21 @@
-<h2 mat-dialog-title>Guthaben aufladen</h2>
+<h2 mat-dialog-title class="text-xl font-semibold">Guthaben aufladen</h2>
 <mat-dialog-content>
     <form [formGroup]="form">
         <div *ngIf="errorMsg">
             {{ errorMsg }}
         </div>
-        <div>
+        <div class="mb-2">
             <label for="amount">Betrag</label>
             <input
                     type="number"
                     id="amount"
                     formControlName="amount"
+                    class="w-full px-2 py-1 bg-white text-black"
             />
         </div>
     </form>
 </mat-dialog-content>
 <mat-dialog-actions>
-    <button (click)="closeDialog()">Abbrechen</button>
-    <button (click)="submit()">Einzahlen</button>
+    <button mat-flat-button (click)="closeDialog()">Abbrechen</button>
+    <button mat-flat-button (click)="submit()">Einzahlen</button>
 </mat-dialog-actions>
diff --git a/frontend/src/app/feature/deposit/deposit.component.ts b/frontend/src/app/feature/deposit/deposit.component.ts
index 7cfd834..43fb94a 100644
--- a/frontend/src/app/feature/deposit/deposit.component.ts
+++ b/frontend/src/app/feature/deposit/deposit.component.ts
@@ -12,11 +12,12 @@ import {
   MatDialogRef,
   MatDialogTitle
 } from "@angular/material/dialog";
+import {MatButton} from "@angular/material/button";
 
 @Component({
   selector: 'app-deposit',
   standalone: true,
-  imports: [ReactiveFormsModule, NgIf, MatDialogTitle, MatDialogContent, MatDialogActions, MatDialogClose],
+  imports: [ReactiveFormsModule, NgIf, MatDialogTitle, MatDialogContent, MatDialogActions, MatDialogClose, MatButton],
   templateUrl: './deposit.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })