Basic scoreboard framework added along with basic CSS to place cards in correct arrangement (using flex)

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

@@ -0,0 +1,16 @@
+.league-container {
+    display: flex;
+    justify-content: flex-start; /* Align cards to the left */
+
+    border: 1px solid rgb(206, 202, 202);
+}
+
+/* Styling for each card representing a live game */
+#game-card {
+    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 */
+    box-sizing: border-box; /* Include padding and border in the element's total width and height */
+}
+

ProjectSourceCode/src/views/partials/head.hbs

@@ -6,6 +6,7 @@
   <!-- Linking forms.css -->
   <link rel="stylesheet" type="text/css" href="css/login_and_registration.css">
   <link rel="stylesheet" type="text/css" href="css/home-screen.css">
+  <link rel="stylesheet" type="text/css" href="css/live-scoreboard/scoreboard.css">
 
   <title>Group 6 Final Project</title>
 

ProjectSourceCode/src/views/partials/live-scoreboard.hbs

@@ -0,0 +1,16 @@
+<div class="scoreboard-container" id="scoreboard">
+    <div class="league-container">
+        <div class="card" id="game-card">
+            <!-- Card content -->
+            Card 1
+        </div>
+        <div class="card" id="game-card">
+            <!-- Card content -->
+            Card 2
+        </div>
+        <div class="card" id="game-card">
+            <!-- Card content -->
+            Card 3
+        </div>
+    </div>
+</div>