57 lines
1.8 KiB
Vue
57 lines
1.8 KiB
Vue
<template>
|
|
<div class="p-2">
|
|
<h1>Pendu</h1>
|
|
<p>Trouve le mot du pendu - Saisi les lettres</p>
|
|
<div class="game-container">
|
|
<svg height="250" width="200" class="figure-container">
|
|
<!-- Potence -->
|
|
<line x1="60" y1="20" x2="140" y2="20" />
|
|
<line x1="140" y1="20" x2="140" y2="50" />
|
|
<line x1="60" y1="20" x2="60" y2="230" />
|
|
<line x1="20" y1="230" x2="100" y2="230" />
|
|
|
|
<!-- Tête -->
|
|
<circle cx="140" cy="70" r="20" class="figure-part"/>
|
|
<!-- Corps -->
|
|
<line x1="140" y1="90" x2="140" y2="150" class="figure-part"/>
|
|
<line x1="140" y1="120" x2="120" y2="100" class="figure-part"/>
|
|
<line x1="140" y1="120" x2="160" y2="100" class="figure-part"/>
|
|
<line x1="140" y1="150" x2="120" y2="180" class="figure-part"/>
|
|
<line x1="140" y1="150" x2="160" y2="180" class="figure-part"/>
|
|
</svg>
|
|
|
|
<div class="wrong-letters-container">
|
|
<div id="wrong-letters"></div>
|
|
</div>
|
|
|
|
<div class="word" id="word"></div>
|
|
</div>
|
|
|
|
<div class="popup-container" id="popup-container">
|
|
<div class="popup">
|
|
<h2 id="final-message"></h2>
|
|
<button id="play-button" @click="playAgain">Play Again</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="notification-container" id="notification-container">
|
|
<p>You have already entered this letter</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "Hangman",
|
|
methods: {
|
|
playAgain: function () {
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|