Enhance user and punisher avatar display in history table

Refactored the layout for player and punisher avatars by adding a container around usernames and aligning elements vertically. Updated the `getAvatarUrl` method to accept only UUID strings, streamlining its usage. Improved styling for better alignment and presentation.

frontend/src/app/bans/history/history.component.scss

@@ -38,6 +38,16 @@ table tr td {
   text-overflow: clip;
 }
 
+.playerContainer {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.username {
+  text-align: center;
+}
+
 img {
   vertical-align: middle;
   border-style: none;
@@ -45,7 +55,6 @@ img {
 
 .avatar {
   margin-bottom: 5px;
-  margin-right: 5px;
   border-radius: 2px;
 }