Fix #1 : Problème de clavier trop large sur certains écrans

This commit is contained in:
JonathanMM 2022-01-12 08:53:28 +01:00
parent 693edb33cc
commit 6d0f50c52f
2 changed files with 31 additions and 2 deletions

View file

@ -55,6 +55,7 @@
<div data-lettre="M" class="input-lettre">M</div>
</div>
<div class="input-ligne">
<div class="input-lettre input-lettre-vide"></div>
<div data-lettre="W" class="input-lettre">W</div>
<div data-lettre="X" class="input-lettre">X</div>
<div data-lettre="C" class="input-lettre">C</div>
@ -62,7 +63,7 @@
<div data-lettre="B" class="input-lettre">B</div>
<div data-lettre="N" class="input-lettre">N</div>
<div data-lettre="_effacer" class="input-lettre"></div>
<div data-lettre="_entree" class="input-lettre"></div>
<div data-lettre="_entree" class="input-lettre input-lettre-entree"></div>
</div>
</div>
<div id="regles-panel">

View file

@ -40,6 +40,11 @@ body {
}
}
h1 {
margin-top: 0.1em;
margin-bottom: 0.25em;
}
#grille {
margin-left: auto;
margin-right: auto;
@ -99,10 +104,19 @@ body {
#input-area {
margin-top: 0.5em;
margin-bottom: 2em;
margin-left: auto;
margin-right: auto;
max-width: 100%;
}
.input-ligne {
display: flex;
justify-content: space-between;
gap: 0.25em;
}
.input-ligne + .input-ligne {
margin-top: 0.5em;
margin-top: 0.25em;
}
.input-lettre {
@ -112,6 +126,15 @@ body {
padding: 0.5em;
user-select: none;
min-width: 0.5em;
flex-grow: 3;
}
.input-lettre.input-lettre-vide {
border: 0;
}
.input-lettre.input-lettre-entree {
flex-grow: 6;
}
.input-lettre.lettre-bien-place {
@ -132,6 +155,11 @@ body {
cursor: pointer;
}
.input-lettre.input-lettre-vide:hover,
.input-lettre.input-lettre-vide:active {
cursor: initial;
}
#regles-panel {
font-size: 14px;
text-align: left;