This commit is contained in:
laura 2022-11-30 12:01:55 +01:00
commit 0d32e60589
2 changed files with 31 additions and 12 deletions

View file

@ -80,7 +80,7 @@
<button type="button" onclick="update(O)">O</button> <button type="button" onclick="update(O)">O</button>
<button type="button" onclick="update(P)">P</button> <button type="button" onclick="update(P)">P</button>
</div> </div>
<div class="line2"> <div class="line2" style="padding-left: 22px;">
<button type="button" onclick="update(A)">A</button> <button type="button" onclick="update(A)">A</button>
<button type="button" onclick="update(S)">S</button> <button type="button" onclick="update(S)">S</button>
<button type="button" onclick="update(D)">D</button> <button type="button" onclick="update(D)">D</button>
@ -92,7 +92,7 @@
<button type="button" onclick="update(L)">L</button> <button type="button" onclick="update(L)">L</button>
</div> </div>
<div class="line3"> <div class="line3">
<button class="enter" type="button" onclick="Enter()">ENTER</button> <button style="width:67px;" type="button" onclick="Enter()">ENTER</button>
<button type="button" onclick="update(Z)">Z</button> <button type="button" onclick="update(Z)">Z</button>
<button type="button" onclick="update(X)">X</button> <button type="button" onclick="update(X)">X</button>
<button type="button" onclick="update(C)">C</button> <button type="button" onclick="update(C)">C</button>
@ -100,7 +100,7 @@
<button type="button" onclick="update(B)">B</button> <button type="button" onclick="update(B)">B</button>
<button type="button" onclick="update(N)">N</button> <button type="button" onclick="update(N)">N</button>
<button type="button" onclick="update(M)">M</button> <button type="button" onclick="update(M)">M</button>
<button class="suppr" type="button" onclick="Supprimer()">SUPPR</button> <button style="width:68px;" type="button" onclick="Supprimer()">SUPPR</button>
</div> </div>

View file

@ -1,10 +1,10 @@
* { * { /* Apparence générale */
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
} }
header{ header{ /* Apparence de l'en-tete */
background-color: white; background-color: white;
text-align: center; text-align: center;
padding-top: 5px; padding-top: 5px;
@ -13,12 +13,12 @@ header{
font-weight: bold; font-weight: bold;
} }
section{ section{ /* Alignement du tableau de jeu */
padding-top: 5%; padding-top: 5%;
align-items: center; align-items: center;
} }
.grille_haut { .grille_haut { /* Alignement du tableau de jeu */
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -26,14 +26,14 @@ section{
} }
.grille_haut div { .grille_haut div { /* Alignement des lignes de 5 cases */
display: grid; display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-gap: 5px; grid-gap: 5px;
padding-top: 5px; padding-top: 5px;
} }
.grille_haut div div { .grille_haut div div { /* Cases de la grille */
background-color: rgb(243, 215, 199); background-color: rgb(243, 215, 199);
border-radius: 5px; border-radius: 5px;
width: 45px; width: 45px;
@ -45,7 +45,7 @@ section{
} }
footer{ footer{ /* Fond et alignement du clavier */
background-color: rgb(243, 215, 199); background-color: rgb(243, 215, 199);
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -62,9 +62,28 @@ footer{
} }
footer div { footer div {
padding-bottom: 5px; padding-bottom: 5px;
padding-bottom: 30px;
} }
.clavier div { .clavier div { /* Ecart entre lignes du clavier */
padding-bottom: 5px; padding-bottom: 5px;
} }
.clavier div button { /* Apparence touches clavier */
padding-bottom: 5px;
width: 45px;
height: 45px;
background-color:rgb(99, 45, 23);
border-radius: 5px;
color : white;
font-weight: bold;
font-size:large;
border:none;
}
.clavier div button:hover{ /* Apparence touches clavier quand suvolées */
background-color:rgb(75, 24, 15);
color : rgb(245, 230, 230);
}