Scrollability added to scoreboard prototype

ProjectSourceCode/src/resources/css/live-scoreboard/scoreboard.css

@@ -1,21 +1,19 @@
-#scoreboard-container {
-    display: flex;
-    transition: transform 0.5s ease;
-  }
+.scoreboard-container {
+    overflow-x: auto; /* Enable horizontal scrolling */
+    white-space: nowrap; /* Prevent cards from wrapping to the next line */
+}
 
 .league-container {
-    display: flex;
-    justify-content: flex-start; /* Align cards to the left */
+    display: inline-block; /* Change display property to inline-block to prevent stretching */
     border: 1px solid rgb(206, 202, 202);
 }
 
-/* Styling for each card representing a live game */
 #game-card {
-    flex: 0 0 auto;
+    display: inline-block; /* Display cards as inline-block to allow them to sit next to each other */
     border: 1px solid #ccc;
-    padding: 20px; /* Increase padding to increase the apparent height */
-    margin: 10px 10px;
-    min-height: 100px; /* Set a minimum height for the cards */
+    padding: 20px;
+    margin: 10px 0; /* Remove horizontal margin */
+    min-height: 100px;
     min-width: 150px;
-    box-sizing: border-box; /* Include padding and border in the element's total width and height */
+    box-sizing: border-box;
 }