mod list component

Dockerfile

@@ -12,4 +12,4 @@ COPY . .
 
 RUN ng build --configuration=production
 
-CMD [ "ng", "serve","--port", "4260", "--host", "0.0.0.0" ]
+CMD [ "ng", "serve","--port", "4270", "--host", "0.0.0.0" ]

angular.json

@@ -61,7 +61,7 @@
           "builder": "@angular/build:dev-server",
           "options": {
             "allowedHosts": [
-              "test.123server.at"
+              "kan.joshihomeserver.ipv64.net"
             ]
           },
           "configurations": {

src/app/components/list/list.component.css

@@ -103,6 +103,17 @@
   background: #e03164;
 }
 
+.icon-btn.exit {
+  margin-left: 2rem;
+  width: 3rem;
+  height: 3rem;
+  background: rgba(0, 0, 0, 0.05);
+}
+
+.icon-btn.exit:hover {
+  background: rgba(0, 0, 0, 0.1);
+}
+
 .status {
   padding: 0.75rem 1rem;
   border-radius: 0.75rem;

src/app/components/list/list.component.html

@@ -1,7 +1,18 @@
 <main class="login-container">
   <div class="glass-card">
     <div class="glass-header">
+      <div class="flex flex-row">
         <h2>Kantinenliste</h2>
+        <button
+          type="button"
+          class="icon-btn exit"
+          (click)="goToLogin()"
+          title="Logout"
+          aria-label="Logout"
+        >
+          <i class="fa-solid fa-solid fa-right-from-bracket"></i>
+        </button>
+      </div>
     </div>
 
     <div *ngIf="loading" class="status">Lade Daten…</div>

src/app/components/list/list.component.ts

@@ -65,6 +65,11 @@ export class ListComponent implements OnInit {
     this.router.navigate(['/create']);
   }
 
+  goToLogin(): void {
+    this.router.navigate(['/login']);
+  }
+
+
   onEdit(item: Kantin): void {
     // Edit-Ansicht
     this.router.navigate(['/create'], {