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>

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,
 })