diff --git a/Scoring Board/score.css b/Scoring Board/score.css new file mode 100644 index 0000000..f3ded0e --- /dev/null +++ b/Scoring Board/score.css @@ -0,0 +1,65 @@ +* { + padding: 0; + margin: 0; + box-sizing: border-box; + font-family: "Poppins", sans-serif; + } + body { + height: 100vh; + background-image: url("./images/ind_vs_pak.webp"); + background-repeat: no-repeat; + background-size: cover; + + } + .scoreboard { + background-color: black; + width: min(90%, 34em); + position: absolute; + transform: translate(-50%, -50%); + left: 50%; + top: 50%; + padding: 3em; + border-radius: 0.5em; + display: grid; + grid-template-columns: 2fr 1fr 2fr; + align-items: center; + } + .team { + text-align: center; + background-color: #353638; + padding: 2em; + border-radius: 0.5em; + } + button { + cursor: pointer; + } + #reset-btn { + background-color: transparent; + border: 3px solid white; + color: #07e387; + height: 5em; + width: 5em; + margin: auto; + border-radius: 0.5em; + } + .team h2 { + color: #dd9f33; + } + .team p { + color: #ffffff; + font-size: 3.75em; + } + .btn-container { + width: 100%; + display: flex; + justify-content: space-between; + } + .team button { + background-color: #46dc69b6; + border: none; + outline: none; + padding: 0.3em 0.7em; + border-radius: 0.3em; + font-weight: 600; + font-size: 1.3em; + } \ No newline at end of file diff --git a/Scoring Board/score.html b/Scoring Board/score.html new file mode 100644 index 0000000..c835f5e --- /dev/null +++ b/Scoring Board/score.html @@ -0,0 +1,39 @@ + + + + + Scoreboard + + + + + + +
+
+

India

+

0

+
+ + +
+
+ + + +
+

Pakistan

+

0

+
+ + +
+
+
+ + + + \ No newline at end of file diff --git a/Scoring Board/score.js b/Scoring Board/score.js new file mode 100644 index 0000000..ab0f3e2 --- /dev/null +++ b/Scoring Board/score.js @@ -0,0 +1,39 @@ + +let teamAScore = 0; +let teamBScore = 0; + + +let teamAScoreValue = document.getElementById("teamAScore"); +let teamBScoreValue = document.getElementById("teamBScore"); + + +let incrementScore = (team) => { + if (team === "teamA") { + teamAScore++; + teamAScoreValue.textContent = teamAScore; + } else if (team === "teamB") { + teamBScore++; + teamBScoreValue.textContent = teamBScore; + } + +}; + + +let decrementScore = (team) => { + if (team === "teamA" && teamAScore > 0) { + teamAScore--; + teamAScoreValue.textContent = teamAScore; + } else if (team === "teamB" && teamBScore > 0) { + teamBScore--; + teamBScoreValue.textContent = teamBScore; + } +}; + + +let resetScores = () => { + teamAScore = 0; + teamBScore = 0; + teamAScoreValue.textContent = teamAScore; + teamBScoreValue.textContent = teamBScore; +}; +