bocquel/Projet_JS
2
0
Fork 2
Code Issues Pull requests Projects 1 Releases Packages Wiki Activity Actions

main final et ses images

Browse source
This commit is contained in:
Baccari Nour 2025-01-01 18:59:10 +01:00
parent 4463b578a9
commit 3deff4ab6d
4 changed files with 15 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
bombe.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 28 KiB

35
main.css
View file

@ -10,29 +10,9 @@ body {
align-items: center; align-items: center;
height: 100vh; height: 100vh;
text-align: center; text-align: center;
overflow:hidden;
} }
.bomb-drop {
width: 50px;
height: 50px;
position: absolute;
top: -60px;
animation: fall 3s linear infinite;
}
@keyframes fall {
0%{
top: -60px;
transform: rotate(0deg);
}
50%{
transform: rotate(180deg);
}
100%{
top:100vh;
transform: rotate(360deg);
}
}
.container { .container {
text-align: center; text-align: center;
@ -58,7 +38,7 @@ header h1 {
.welcome-image { .welcome-image {
width: 80%; width: 80%;
max-width: 400px; max-width: 70px;
margin: 20px auto; margin: 20px auto;
display: block; display: block;
border-radius: 8px; border-radius: 8px;
@ -66,6 +46,7 @@ header h1 {
} }
button { button {
padding: 15px 30px; padding: 15px 30px;
font-size: 18px; font-size: 18px;
@ -76,10 +57,14 @@ button {
border-radius: 8px; border-radius: 8px;
text-transform: uppercase; text-transform: uppercase;
cursor: pointer; cursor: pointer;
transition: background-color 0.3s, transform 0.2s; /*transition: background-color 0.3s, transform 0.2s;*/
}
transform: scale(1.05);
} }
button:hover {
background-color: #d3e017;
transform: scale(1.1);
}
footer { footer {

12
main.html
View file

@ -8,6 +8,8 @@
</head> </head>
<body> <body>
<div class="emoji-background"></div>
<div class="container"> <div class="container">
<header> <header>
<img src="logo.png" alt="Logo du Démineur" class="logo"> <img src="logo.png" alt="Logo du Démineur" class="logo">
@ -15,7 +17,7 @@
</header> </header>
<main> <main>
<p>Préparez-vous à une expérience de jeu inoubliable ! Cliquez sur le bouton ci-dessous pour commencer votre aventure.</p> <p>Préparez-vous à une expérience de jeu inoubliable ! Cliquez sur le bouton ci-dessous pour commencer votre aventure.</p>
<img src="welcome-image.png" alt="Image de bienvenue" class="welcome-image"> <img src="smile.png" alt="Image de bienvenue" class="welcome-image">
<button id="play-button">JOUER</button> <button id="play-button">JOUER</button>
</main> </main>
<footer> <footer>
@ -23,14 +25,10 @@
</footer> </footer>
</div> </div>
<img src="bombe.png" alt="Bombe" class="bomb-drop">
<scirpt src="script.js"></scirpt>
<script> <script>
document.getElementById('play-button').addEventListener('click', () => { document.getElementById('play-button').addEventListener('click', () => {
window.location.href = 'game.html'; window.location.href = 'demineur.html';});
});
</script> </script>
</body> </body>
</html> </html>

BIN
smile.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.3 KiB