From 463090b22469b311af0ff7f8919667672fa0c1c4 Mon Sep 17 00:00:00 2001
From: Phan Huy Tran <p.tran@neusta.de>
Date: Wed, 4 Jun 2025 11:52:49 +0200
Subject: [PATCH] style: fix pipelines

---
 .../src/app/feature/home/home.component.html  |   6 +-
 .../src/app/feature/home/home.component.ts    |  13 +--
 .../components/navbar/navbar.component.html   | 106 +++++++++++++-----
 .../components/navbar/navbar.component.ts     |   8 +-
 4 files changed, 89 insertions(+), 44 deletions(-)

diff --git a/frontend/src/app/feature/home/home.component.html b/frontend/src/app/feature/home/home.component.html
index c195acf..9b79a9e 100644
--- a/frontend/src/app/feature/home/home.component.html
+++ b/frontend/src/app/feature/home/home.component.html
@@ -43,9 +43,11 @@
               </div>
             </div>
           </div>
-          
+
           <!-- Bottom row with 2 games centered -->
-          <div class="grid grid-cols-1 sm:grid-cols-2 gap-4 max-w-2xl mx-auto xl:max-w-3xl xl:gap-6">
+          <div
+            class="grid grid-cols-1 sm:grid-cols-2 gap-4 max-w-2xl mx-auto xl:max-w-3xl xl:gap-6"
+          >
             <div class="card group" *ngFor="let game of featuredGames.slice(3, 5)">
               <div class="relative overflow-hidden rounded-lg">
                 <img
diff --git a/frontend/src/app/feature/home/home.component.ts b/frontend/src/app/feature/home/home.component.ts
index f6c4ab2..f032246 100644
--- a/frontend/src/app/feature/home/home.component.ts
+++ b/frontend/src/app/feature/home/home.component.ts
@@ -1,16 +1,13 @@
-import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
-import {NgFor} from '@angular/common';
-import {ActivatedRoute, Router} from '@angular/router';
-import {Game} from 'app/model/Game';
+import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { NgFor } from '@angular/common';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Game } from 'app/model/Game';
 import format from 'ajv/dist/vocabularies/format';
 
 @Component({
   selector: 'app-homepage',
   standalone: true,
-  imports: [
-    NgFor,
-
-  ],
+  imports: [NgFor],
   templateUrl: './home.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
diff --git a/frontend/src/app/shared/components/navbar/navbar.component.html b/frontend/src/app/shared/components/navbar/navbar.component.html
index b499668..8e7942e 100644
--- a/frontend/src/app/shared/components/navbar/navbar.component.html
+++ b/frontend/src/app/shared/components/navbar/navbar.component.html
@@ -1,29 +1,27 @@
 <nav class="bg-deep-blue-light border-b border-emerald-500/30 shadow-lg">
   <div class="max-w-full mx-auto px-6">
     <div class="flex justify-between items-center h-16">
-      <!-- Logo and Brand -->
       <div class="flex items-center space-x-6">
         <a routerLink="/" class="flex items-center space-x-3 group">
           <div class="flex flex-col">
-            <span class="text-xl font-bold text-white">
-              Trustworthy Casino
-            </span>
-            <span class="text-xs text-emerald-400 font-medium">Premium Gaming</span>
+            <span class="text-xl font-bold text-white"> Trustworthy Casino </span>
+            <span class="text-xs text-emerald-400 font-medium">Trust. Play. Win.</span>
           </div>
         </a>
 
-        <!-- Navigation Links -->
         <div class="hidden md:flex items-center space-x-1">
-          <a routerLink="/home" class="flex items-center px-4 py-2 text-white/90 hover:text-white font-medium rounded-lg hover:bg-white/10 transition-colors duration-200">
+          <a
+            routerLink="/home"
+            class="flex items-center px-4 py-2 text-white/90 hover:text-white font-medium rounded-lg hover:bg-white/10 transition-colors duration-200"
+          >
             <svg class="w-4 h-4 mr-2" fill="currentColor" viewBox="0 0 24 24">
-              <path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"/>
+              <path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />
             </svg>
             Spiele
           </a>
         </div>
       </div>
 
-      <!-- User Actions -->
       <div class="hidden md:flex items-center space-x-2">
         @if (!isLoggedIn()) {
           <button
@@ -31,7 +29,12 @@
             class="flex items-center px-4 py-2 text-white font-medium border border-emerald-500 rounded-lg hover:bg-emerald-500/10 transition-colors duration-200"
           >
             <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"/>
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                d="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"
+              />
             </svg>
             Anmelden
           </button>
@@ -40,28 +43,41 @@
             class="flex items-center px-4 py-2 bg-emerald-600 text-white font-medium rounded-lg hover:bg-emerald-500 transition-colors duration-200"
           >
             <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"/>
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"
+              />
             </svg>
             Registrieren
           </button>
         }
 
         @if (isLoggedIn()) {
-          <!-- Balance Display -->
-          <div class="flex items-center px-4 py-2 bg-slate-700 border border-emerald-500/30 rounded-lg font-medium">
+          <div
+            class="flex items-center px-4 py-2 bg-slate-700 border border-emerald-500/30 rounded-lg font-medium"
+          >
             <span class="text-emerald-400 text-sm mr-2">Guthaben:</span>
-            <span [class]="balance() < 0 ? 'text-red-400 font-bold' : 'text-white font-bold'" class="text-sm">
+            <span
+              [class]="balance() < 0 ? 'text-red-400 font-bold' : 'text-white font-bold'"
+              class="text-sm"
+            >
               <app-animated-number [value]="balance()" [duration]="0.5"></app-animated-number>
             </span>
           </div>
 
-          <!-- Action Buttons -->
           <button
             class="flex items-center px-4 py-2 bg-emerald-600 text-white font-medium rounded-lg hover:bg-emerald-500 transition-colors duration-200"
             (click)="openDepositModal()"
           >
             <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                d="M12 6v6m0 0v6m0-6h6m-6 0H6"
+              />
             </svg>
             Einzahlen
           </button>
@@ -88,14 +104,18 @@
             class="flex items-center px-4 py-2 text-red-400 font-medium border border-red-500/50 rounded-lg hover:bg-red-500/10 transition-colors duration-200"
           >
             <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"/>
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"
+              />
             </svg>
             Abmelden
           </button>
         }
       </div>
 
-      <!-- Mobile Menu Button -->
       <div class="md:hidden">
         <button
           (click)="toggleMenu()"
@@ -133,7 +153,6 @@
       </div>
     </div>
 
-    <!-- Mobile Menu -->
     <div [class]="isMenuOpen ? 'block' : 'hidden'" class="md:hidden">
       <div class="px-2 pt-2 pb-4 space-y-3 bg-slate-700 rounded-lg mt-2">
         <a
@@ -141,7 +160,7 @@
           class="flex items-center px-4 py-3 text-white/90 hover:text-white hover:bg-white/10 rounded-lg transition-colors duration-200"
         >
           <svg class="w-4 h-4 mr-2" fill="currentColor" viewBox="0 0 24 24">
-            <path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"/>
+            <path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />
           </svg>
           Spiele
         </a>
@@ -153,7 +172,12 @@
               class="w-full flex items-center justify-center px-4 py-3 text-white font-medium border border-emerald-500 rounded-lg hover:bg-emerald-500/10 transition-colors duration-200"
             >
               <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"/>
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"
+                />
               </svg>
               Anmelden
             </button>
@@ -162,16 +186,25 @@
               class="w-full flex items-center justify-center px-4 py-3 bg-emerald-600 text-white font-medium rounded-lg hover:bg-emerald-500 transition-colors duration-200"
             >
               <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"/>
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"
+                />
               </svg>
               Registrieren
             </button>
           }
           @if (isLoggedIn()) {
-            <!-- Mobile Balance Display -->
-            <div class="flex items-center justify-center px-4 py-3 bg-slate-700 border border-emerald-500/30 rounded-lg">
+            <div
+              class="flex items-center justify-center px-4 py-3 bg-slate-700 border border-emerald-500/30 rounded-lg"
+            >
               <span class="text-emerald-400 text-sm font-medium mr-2">Guthaben:</span>
-              <span [class]="balance() < 0 ? 'text-red-400 font-bold' : 'text-white font-bold'" class="text-sm">
+              <span
+                [class]="balance() < 0 ? 'text-red-400 font-bold' : 'text-white font-bold'"
+                class="text-sm"
+              >
                 <app-animated-number [value]="balance()" [duration]="0.5"></app-animated-number> €
               </span>
             </div>
@@ -181,7 +214,12 @@
               class="w-full flex items-center justify-center px-4 py-3 bg-emerald-600 text-white font-medium rounded-lg hover:bg-emerald-500 transition-colors duration-200"
             >
               <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M12 6v6m0 0v6m0-6h6m-6 0H6"
+                />
               </svg>
               Einzahlen
             </button>
@@ -191,8 +229,13 @@
               class="w-full flex items-center justify-center px-4 py-3 bg-slate-700 text-white font-medium rounded-lg hover:bg-slate-600 border border-slate-600 transition-colors duration-200"
             >
               <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v10a2 2 0 002 2h8a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/>
-            </svg>
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M9 5H7a2 2 0 00-2 2v10a2 2 0 002 2h8a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"
+                />
+              </svg>
               Transaktionen
             </button>
 
@@ -201,7 +244,12 @@
               class="w-full flex items-center justify-center px-4 py-3 text-red-400 font-medium border border-red-500/50 rounded-lg hover:bg-red-500/10 transition-colors duration-200"
             >
               <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"/>
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"
+                />
               </svg>
               Abmelden
             </button>
diff --git a/frontend/src/app/shared/components/navbar/navbar.component.ts b/frontend/src/app/shared/components/navbar/navbar.component.ts
index 987f13f..2d17ca5 100644
--- a/frontend/src/app/shared/components/navbar/navbar.component.ts
+++ b/frontend/src/app/shared/components/navbar/navbar.component.ts
@@ -10,12 +10,10 @@ import {
 } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { AuthService } from '@service/auth.service';
-import {Observable, Subscription} from 'rxjs';
+import { Subscription } from 'rxjs';
 import { AnimatedNumberComponent } from '@blackjack/components/animated-number/animated-number.component';
-import {DepositComponent} from "../../../feature/deposit/deposit.component";
-import {TransactionHistoryComponent} from "../../../feature/transaction-history/transaction-history.component";
-import {TransactionData} from "../../../model/TransactionData";
-import {TransactionService} from "@service/transaction.service";
+import { DepositComponent } from '../../../feature/deposit/deposit.component';
+import { TransactionHistoryComponent } from '../../../feature/transaction-history/transaction-history.component';
 
 @Component({
   selector: 'app-navbar',