lib/presentation/views/main_menu/game_history_view.dart

@@ -134,16 +134,16 @@ class _GameHistoryViewState extends State<GameHistoryView> {
         children: [
           Column(
             children: [
-              Container(margin: EdgeInsets.only(bottom: 75)),
+              Container(margin: const EdgeInsets.only(bottom: 75)),
               Expanded(
                 child: gameHistoryListView(allGameData, suggestedGameData),
               ),
             ],
           ),
           Container(
-            margin: EdgeInsets.only(top: 10, bottom: 10, left: 10, right: 10),
+            margin: const EdgeInsets.only(top: 10, bottom: 10, left: 10, right: 10),
             child: SearchBar(
-              leading: Icon(Icons.search),
+              leading: const Icon(Icons.search),
               onChanged: (value) {
                 if (value.isEmpty) {
                   setState(() {
@@ -195,9 +195,9 @@ Widget gameHistoryListView(allGameData, suggestedGameData) {
       return GameHistoryTile(
         gameTitle: currentGame['title'],
         gameType: currentGame['game'],
-        ruleset: currentGame['date'],
+        date: currentGame['date'],
         groupName: currentGame['group'],
-        winner: "ich",
+        winner: 'ich',
       );
     },
   );

lib/presentation/widgets/game_history_tile.dart

@@ -5,7 +5,7 @@ import 'package:skeletonizer/skeletonizer.dart';
 class GameHistoryTile extends StatefulWidget {
   final String gameTitle;
   final String gameType;
-  final String ruleset;
+  final String date;
   final String groupName;
   final String winner;
 
@@ -13,7 +13,7 @@ class GameHistoryTile extends StatefulWidget {
     super.key,
     required this.gameTitle,
     required this.gameType,
-    required this.ruleset,
+    required this.date,
     required this.groupName,
     required this.winner,
   });
@@ -29,18 +29,46 @@ class _GameHistoryTileState extends State<GameHistoryTile> {
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
-        Row(
-          children: [
-            Text(
-              widget.gameTitle,
-              style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
-            ),
-            const SizedBox(width: 5),
-            Text(
-              widget.gameType,
-              style: const TextStyle(fontSize: 14, color: Colors.grey),
-            ),
-          ],
+        Container(
+          margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 10),
+          padding: const EdgeInsets.symmetric(vertical: 5, horizontal: 10),
+          decoration: BoxDecoration(
+            color: CustomTheme.boxColor,
+            border: Border.all(color: CustomTheme.boxBorder),
+            borderRadius: BorderRadius.circular(12),
+          ),
+          child: Column(
+            children: [
+              Row(
+                children: [
+                  Text(
+                      widget.gameTitle,
+                      style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
+                      overflow: TextOverflow.ellipsis,
+                    ),
+                ],
+              ),
+              Row(
+                children: [
+                  Text(
+                    widget.date,
+                    style: const TextStyle(fontSize: 14, color: Colors.grey),
+                    textAlign: TextAlign.left,
+                  ),
+                  const SizedBox(width: 5),
+                  const Text('·'),
+                  const SizedBox(width: 5),
+                  Text(
+                    widget.gameType,
+                    style: const TextStyle(fontSize: 14, color: Colors.grey),
+                    textAlign: TextAlign.left,
+                  ),
+                ],
+              ),
+              const SizedBox(height: 15),
+              
+            ]
+          )
         ),
       ],
     );