From 4331484d48e7df0f43e6baa523be9bbad13f3aa9 Mon Sep 17 00:00:00 2001
From: Phan Huy Tran <p.tran@neusta.de>
Date: Wed, 4 Jun 2025 12:15:07 +0200
Subject: [PATCH] feat: adjust icons

---
 frontend/angular.json                         |  3 ++-
 .../components/navbar/navbar.component.html   | 26 +++----------------
 .../components/navbar/navbar.component.ts     | 12 ++++-----
 frontend/src/assets/deposit.svg               |  4 +++
 frontend/src/assets/games.svg                 |  6 +++++
 frontend/src/assets/transaction.svg           | 12 +++++++++
 6 files changed, 34 insertions(+), 29 deletions(-)
 create mode 100644 frontend/src/assets/deposit.svg
 create mode 100644 frontend/src/assets/games.svg
 create mode 100644 frontend/src/assets/transaction.svg

diff --git a/frontend/angular.json b/frontend/angular.json
index a9f9a84..d8c3879 100644
--- a/frontend/angular.json
+++ b/frontend/angular.json
@@ -21,7 +21,8 @@
               {
                 "glob": "**/*",
                 "input": "public"
-              }
+              },
+              "src/assets"
             ],
             "styles": [
               "src/styles.css"
diff --git a/frontend/src/app/shared/components/navbar/navbar.component.html b/frontend/src/app/shared/components/navbar/navbar.component.html
index 8e7942e..d8009eb 100644
--- a/frontend/src/app/shared/components/navbar/navbar.component.html
+++ b/frontend/src/app/shared/components/navbar/navbar.component.html
@@ -14,9 +14,7 @@
             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" />
-            </svg>
+            <img class="mr-2 w-4 h-4" src="assets/games.svg" alt="gamess">
             Spiele
           </a>
         </div>
@@ -71,14 +69,7 @@
             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"
-              />
-            </svg>
+            <img class="mr-2 w-3 h-3" src="assets/deposit.svg" alt="deposits">
             Einzahlen
           </button>
 
@@ -91,6 +82,7 @@
             class="flex items-center px-4 py-2 bg-slate-700 text-white font-medium rounded-lg hover:bg-slate-600 border border-slate-600 transition-colors duration-200"
             (click)="openTransactionModal()"
           >
+            <img class="mr-2 w-4 h-4" src="assets/transaction.svg" alt="transactions">
             Transaktionen
           </button>
 
@@ -159,9 +151,7 @@
           routerLink="/home"
           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" />
-          </svg>
+          <img class="mr-2 w-4 h-4" src="assets/games.svg" alt="gamess">
           Spiele
         </a>
 
@@ -228,14 +218,6 @@
               (click)="openTransactionModal()"
               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>
               Transaktionen
             </button>
 
diff --git a/frontend/src/app/shared/components/navbar/navbar.component.ts b/frontend/src/app/shared/components/navbar/navbar.component.ts
index 2d17ca5..87f4552 100644
--- a/frontend/src/app/shared/components/navbar/navbar.component.ts
+++ b/frontend/src/app/shared/components/navbar/navbar.component.ts
@@ -8,12 +8,12 @@ import {
   Output,
   signal,
 } from '@angular/core';
-import { RouterModule } from '@angular/router';
-import { AuthService } from '@service/auth.service';
-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 {RouterModule} from '@angular/router';
+import {AuthService} from '@service/auth.service';
+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';
 
 @Component({
   selector: 'app-navbar',
diff --git a/frontend/src/assets/deposit.svg b/frontend/src/assets/deposit.svg
new file mode 100644
index 0000000..51d3f6a
--- /dev/null
+++ b/frontend/src/assets/deposit.svg
@@ -0,0 +1,4 @@
+<svg style="color: white;" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16">
+  <path fill="currentColor" d="m8 16l-2-3h1v-2h2v2h1zm7-15v8H1V1zm1-1H0v10h16z"/>
+  <path fill="currentColor" d="M8 2a3 3 0 1 1 0 6h5V7h1V3h-1V2zM5 5a3 3 0 0 1 3-3H3v1H2v4h1v1h5a3 3 0 0 1-3-3"/>
+</svg>
diff --git a/frontend/src/assets/games.svg b/frontend/src/assets/games.svg
new file mode 100644
index 0000000..cbb9f4a
--- /dev/null
+++ b/frontend/src/assets/games.svg
@@ -0,0 +1,6 @@
+<svg style="color: white;" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512">
+  <path fill="currentColor"
+        d="M495.24 267.592L445.066 41.083A32.04 32.04 0 0 0 406.9 16.76L180.393 66.934a32 32 0 0 0-24.322 38.166l21.021 94.9H48a32.036 32.036 0 0 0-32 32v232a32.036 32.036 0 0 0 32 32h232a32.036 32.036 0 0 0 32-32V340.957l158.917-35.2a32.04 32.04 0 0 0 24.323-38.165M280 464H48V232h136.181l22.063 99.606a32.03 32.03 0 0 0 31.18 25.092a32.3 32.3 0 0 0 6.984-.769l35.6-7.886L280.02 464Zm184-189.487l-226.513 50.173l-50.173-226.51L413.824 48l50.193 226.505Z"/>
+  <path fill="currentColor"
+        d="M80 264h40v40H80zm0 128h40v40H80zm128 0h40v40h-40zm-64-64h40v40h-40zm81.456-205.433l39.054-8.644l8.644 39.055l-39.054 8.644zm152.672 97.223l39.054-8.65l8.65 39.054l-39.054 8.65zm-76.324-48.649l39.053-8.65l8.65 39.053l-39.052 8.65z"/>
+</svg>
diff --git a/frontend/src/assets/transaction.svg b/frontend/src/assets/transaction.svg
new file mode 100644
index 0000000..d661947
--- /dev/null
+++ b/frontend/src/assets/transaction.svg
@@ -0,0 +1,12 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="1em"
+  height="1em"
+  viewBox="0 0 24 24"
+  style="color: white;"
+>
+  <g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" color="currentColor">
+    <path d="M4.58 8.607L2 8.454C3.849 3.704 9.158 1 14.333 2.344c5.513 1.433 8.788 6.918 7.314 12.25c-1.219 4.411-5.304 7.337-9.8 7.406"/>
+    <path d="M12 22C6.5 22 2 17 2 11m11.604-1.278c-.352-.37-1.213-1.237-2.575-.62c-1.361.615-1.577 2.596.482 2.807c.93.095 1.537-.11 2.093.47c.556.582.659 2.198-.761 2.634s-2.341-.284-2.588-.509m1.653-6.484v.79m0 6.337v.873"/>
+  </g>
+</svg>