diff --git a/README.md b/README.md index 437e0056..12db9ce0 100644 --- a/README.md +++ b/README.md @@ -266,6 +266,7 @@ ________________________________________________________________________________ + ________________________________________________________________________________________________________________________________________________________________ # How to make a PR in a Project 🟢 diff --git a/SinglePlayer - Games/Slay the Spire/index.html b/SinglePlayer - Games/Slay the Spire/index.html new file mode 100644 index 00000000..783c0489 --- /dev/null +++ b/SinglePlayer - Games/Slay the Spire/index.html @@ -0,0 +1,25 @@ + + + + + + Card Battle Game + + + +
+

Card Battle Game

+
+

Player

+

Health: 50

+
+
+
+

Enemy

+

Health: 30

+
+ +
+ + + diff --git a/SinglePlayer - Games/Slay the Spire/script.js b/SinglePlayer - Games/Slay the Spire/script.js new file mode 100644 index 00000000..4ec94aae --- /dev/null +++ b/SinglePlayer - Games/Slay the Spire/script.js @@ -0,0 +1,41 @@ +document.addEventListener('DOMContentLoaded', () => { + const playerHealthElement = document.getElementById('playerHealth'); + const enemyHealthElement = document.getElementById('enemyHealth'); + const playerDeckElement = document.getElementById('playerDeck'); + const drawCardButton = document.getElementById('drawCardButton'); + + let playerHealth = 50; + let enemyHealth = 30; + + const cards = [ + { name: 'Attack', damage: 10 }, + { name: 'Heal', heal: 10 } + ]; + + function updateHealth() { + playerHealthElement.textContent = `Health: ${playerHealth}`; + enemyHealthElement.textContent = `Health: ${enemyHealth}`; + } + + function drawCard() { + const randomCard = cards[Math.floor(Math.random() * cards.length)]; + const cardElement = document.createElement('div'); + cardElement.classList.add('card'); + cardElement.textContent = randomCard.name; + cardElement.addEventListener('click', () => playCard(randomCard, cardElement)); + playerDeckElement.appendChild(cardElement); + } + + function playCard(card, cardElement) { + if (card.damage) { + enemyHealth -= card.damage; + } else if (card.heal) { + playerHealth += card.heal; + } + updateHealth(); + cardElement.remove(); + } + + drawCardButton.addEventListener('click', drawCard); + updateHealth(); +}); diff --git a/SinglePlayer - Games/Slay the Spire/styles.css b/SinglePlayer - Games/Slay the Spire/styles.css new file mode 100644 index 00000000..1b7c8a40 --- /dev/null +++ b/SinglePlayer - Games/Slay the Spire/styles.css @@ -0,0 +1,37 @@ +body { + font-family: Arial, sans-serif; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + background-color: #f5f5f5; +} + +.container { + text-align: center; + background-color: #fff; + padding: 20px; + border-radius: 10px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); +} + +#player, #enemy { + margin: 20px 0; +} + +#playerDeck { + display: flex; + justify-content: center; + gap: 10px; +} + +.card { + padding: 10px; + border: 1px solid #ccc; + border-radius: 5px; + cursor: pointer; +} + +.card:hover { + background-color: #f0f0f0; +} diff --git a/additionalpage/game.html b/additionalpage/game.html index 695cc4c8..5ed2183f 100644 --- a/additionalpage/game.html +++ b/additionalpage/game.html @@ -7665,7 +7665,6 @@

Doodling_Game

-
@@ -7725,6 +7724,7 @@

Duck_Hunt_Game

+