IUT_Informatique/Snake
Archived
1
0
Fork 0
Code Activity

Merge branch 'front' into 'master'

Browse source 
Adding scorebaord

See merge request p1905458/snake!3
This commit is contained in:
Ethanell 2021-03-25 08:27:09 +00:00
commit 6737241714
2 changed files with 72 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
index.html
View file

@ -30,6 +30,19 @@
<p>Your score : <span id="gameoverscore">4</span></p> <p>Your score : <span id="gameoverscore">4</span></p>
</div> </div>
</div> </div>
<div id="scoreboard" class="close">
<h1>Scoreboard</h1>
<div class="row-score">
<p class="player-score">12</p>
<p class="pseudo">Kybo_</p>
</div>
<div class="row-score">
<p class="player-score">12</p>
<p class="pseudo">Kybo_</p>
</div>
</div>
<script type="module" src="sources/js/index.js"></script> <script type="module" src="sources/js/index.js"></script>
</body> </body>
</html> </html>

59
sources/css/style.css
View file

@ -67,6 +67,65 @@ h1{
text-align: center; text-align: center;
} }
#scoreboard{
width: 400px;
color: rgb(0, 255, 200);
height: 100%;
position: fixed;
top: 0;
border: 1px solid rgb(0, 255, 200);
background-color: rgba(0, 0, 0, 0.5);
border-right: none;
border-top: none;
border-bottom: none;
right: 0;
transition-duration: 0.8s;
}
#scoreboard.close{
transform: translateX(300px);
}
#scoreboard.close .row-score{
display: none;
}
#scoreboard.close h1{
text-orientation: upright;
writing-mode: vertical-rl;
margin-top: 250px;
padding-left: 30px;
}
#scoreboard h1{
width: auto;
font-size: 35px;
margin: 0;
padding: 0;
padding: 10px;
padding-top: 40px;
color:#FF4294;
padding-bottom: 40px;
}
#scoreboard .row-score{
width: 100%;
font-size: 50px;
font-family: 'Teko', sans-serif;
padding: 0 50px;
margin-bottom: 20px;
}
.pseudo{
margin: 0;
}
#scoreboard .player-score{
float: right;
margin: 0;
}
#menu button{ #menu button{
display: block; display: block;
text-align: center; text-align: center;