From ce9260ede687dab5919ec084c91e790218ccae66 Mon Sep 17 00:00:00 2001
From: Peter <42907716+MrShack@users.noreply.github.com>
Date: Fri, 11 Apr 2025 21:56:46 +0200
Subject: [PATCH] Added table headings and darkmode fix

---
 frontend/src/app/bans/bans.component.html     | 20 ++++++++++---------
 .../app/bans/history/history.component.html   |  7 +++++++
 2 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/frontend/src/app/bans/bans.component.html b/frontend/src/app/bans/bans.component.html
index a723943..a8db728 100644
--- a/frontend/src/app/bans/bans.component.html
+++ b/frontend/src/app/bans/bans.component.html
@@ -6,15 +6,17 @@
     </div>
   </app-header>
 
-  <div class="container">
-    <div class="columnContainer">
-      <button (click)="punishmentType = 'all'">all</button>
-      <button (click)="punishmentType = 'ban'">bans</button>
-      <button (click)="punishmentType = 'mute'">mutes</button>
-      <button (click)="punishmentType = 'warn'">warnings</button>
-    </div>
-    <div class="columnContainer">
-      <app-history [userType]="userType" [punishmentType]="punishmentType"></app-history>
+  <div class="darkmodeSection">
+    <div class="columnSection">
+      <div class="columnContainer">
+        <button (click)="punishmentType = 'all'">all</button>
+        <button (click)="punishmentType = 'ban'">bans</button>
+        <button (click)="punishmentType = 'mute'">mutes</button>
+        <button (click)="punishmentType = 'warn'">warnings</button>
+      </div>
+      <div class="columnContainer">
+        <app-history [userType]="userType" [punishmentType]="punishmentType"></app-history>
+      </div>
     </div>
   </div>
 </ng-container>
diff --git a/frontend/src/app/bans/history/history.component.html b/frontend/src/app/bans/history/history.component.html
index 0f22dba..3974149 100644
--- a/frontend/src/app/bans/history/history.component.html
+++ b/frontend/src/app/bans/history/history.component.html
@@ -4,6 +4,13 @@
 
 <ng-container *ngIf="history.length > 0">
   <table>
+    <tr>
+      <th>Player</th>
+      <th>Banned By</th>
+      <th>Reason</th>
+      <th>Date</th>
+      <th>Expires</th>
+    </tr>
     <tr *ngFor="let entry of history">
       <td>{{ entry.username }}</td>
       <td>{{ entry.punishedBy }}</td>