Skip to content

Commit 2153ca8

Browse files
remitangremitang
authored
Add files via upload
0 parents  commit 2153ca8

File tree

3 files changed

+505
-0
lines changed

3 files changed

+505
-0
lines changed

‎tetris.css

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
.text-center {
2+
text-align: center;
3+
}
4+
5+
.flex {
6+
display: flex;
7+
}
8+
9+
.font-weight-bold {
10+
font-weight: bold;
11+
margin-right:40px;
12+
}
13+
14+
.justify-content-center {
15+
justify-content: center;
16+
}
17+
18+
.justify-content-around {
19+
justify-content: space-around;
20+
}
21+
22+
.justify-content-between {
23+
justify-content: space-between;
24+
}
25+
26+
.btn {
27+
display:inline-block;
28+
font-weight:400;
29+
color:#212529;
30+
text-align:center;
31+
vertical-align:middle;
32+
-webkit-user-select:none;
33+
-moz-user-select:none;
34+
-ms-user-select:none;
35+
user-select:none;
36+
background-color:transparent;
37+
border:1px solid transparent;
38+
padding:.375rem .75rem;
39+
font-size:1rem;
40+
line-height:1.5;
41+
border-radius:.25rem;
42+
transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
43+
}
44+
45+
.btn-primary {
46+
color:#212529;
47+
background-color:#ffc107;
48+
border-color:#ffc107
49+
}
50+
51+
.btn-info{
52+
color:#fff;
53+
background-color:#17a2b8;
54+
border-color:#17a2b8
55+
}
56+
57+
58+
#grille span {
59+
text-align: center;
60+
float: left;
61+
background-color: #696969;
62+
border: 0.5px #5a5e6b solid;
63+
height: 22px;
64+
width: 22px;
65+
}
66+
67+
#grille {
68+
display: flex;
69+
flex-direction: column;
70+
align-items: center;
71+
margin-right:30px;
72+
}
73+
74+
.bg-commande {
75+
border-radius: 5px;
76+
padding: 5px 50px;
77+
margin-right: 5px;
78+
margin-bottom: 20px;
79+
background-color: #A9A9A9 ;
80+
font-size:0.9em;
81+
}

‎tetris.html

+71
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
<!DOCTYPE html>
2+
<html lang="fr">
3+
4+
<head>
5+
<meta charset="utf-8" />
6+
<title>Tetris</title>
7+
<link rel="stylesheet" href="tetris.css" />
8+
</head>
9+
10+
<body>
11+
<section id="demo">
12+
<h2 class="text-center">Demo Tetris</h2>
13+
14+
<div class="container">
15+
<div class="flex justify-content-center">
16+
<div id="grille"></div>
17+
18+
<div>
19+
<div class="bg-commande">
20+
<h3 class="text-center">Commandes</h3>
21+
<div class="flex justify-content-around">
22+
<span class="font-weight-bold">GAUCHE</span>
23+
<span>Deplace à gauche</span>
24+
</div>
25+
<div class="flex justify-content-around">
26+
<span class="font-weight-bold">DROITE</span>
27+
<span>Deplace à droite</span>
28+
</div>
29+
<div class="flex justify-content-around">
30+
<span class="font-weight-bold">BAS</span>
31+
<span>Descente rapide</span>
32+
</div>
33+
<div class="flex justify-content-around">
34+
<span class="font-weight-bold">HAUT</span>
35+
<span>Pivoter la pièce</span>
36+
</div>
37+
<div class="flex justify-content-around">
38+
<span class="font-weight-bold">SPACE</span><span>Descente maximal</span>
39+
</div>
40+
41+
</div>
42+
<div>
43+
<div class="flex justify-content-between">
44+
<span id="time">Temps écoulé : 0:00</span>
45+
<span id="niveau">Niveau : 1</span>
46+
</div>
47+
<div class="flex justify-content-between">
48+
<span id="score">Score : 0</span>
49+
<span id="ligne">Lignes : 0</span>
50+
</div>
51+
<div class="text-center">
52+
<button id="start" class="btn btn-primary">
53+
START
54+
</button>
55+
<button id="restart" class="btn btn-info">
56+
RESTART
57+
</button>
58+
</div>
59+
</div>
60+
</div>
61+
</div>
62+
</div>
63+
<div>
64+
</section>
65+
66+
67+
</body>
68+
69+
<script src="tetris.js"></script>
70+
71+
</html>

0 commit comments

Comments
 (0)