mirror of
https://framagit.org/JonathanMM/sutom.git
synced 2024-06-02 14:02:19 +02:00
Fix #1 : Problème de clavier trop large sur certains écrans
This commit is contained in:
parent
693edb33cc
commit
6d0f50c52f
|
@ -55,6 +55,7 @@
|
||||||
<div data-lettre="M" class="input-lettre">M</div>
|
<div data-lettre="M" class="input-lettre">M</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="input-ligne">
|
<div class="input-ligne">
|
||||||
|
<div class="input-lettre input-lettre-vide"></div>
|
||||||
<div data-lettre="W" class="input-lettre">W</div>
|
<div data-lettre="W" class="input-lettre">W</div>
|
||||||
<div data-lettre="X" class="input-lettre">X</div>
|
<div data-lettre="X" class="input-lettre">X</div>
|
||||||
<div data-lettre="C" class="input-lettre">C</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="B" class="input-lettre">B</div>
|
||||||
<div data-lettre="N" class="input-lettre">N</div>
|
<div data-lettre="N" class="input-lettre">N</div>
|
||||||
<div data-lettre="_effacer" class="input-lettre">⌫</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>
|
</div>
|
||||||
<div id="regles-panel">
|
<div id="regles-panel">
|
||||||
|
|
|
@ -40,6 +40,11 @@ body {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin-top: 0.1em;
|
||||||
|
margin-bottom: 0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
#grille {
|
#grille {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
|
@ -99,10 +104,19 @@ body {
|
||||||
#input-area {
|
#input-area {
|
||||||
margin-top: 0.5em;
|
margin-top: 0.5em;
|
||||||
margin-bottom: 2em;
|
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 {
|
.input-ligne + .input-ligne {
|
||||||
margin-top: 0.5em;
|
margin-top: 0.25em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.input-lettre {
|
.input-lettre {
|
||||||
|
@ -112,6 +126,15 @@ body {
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
min-width: 0.5em;
|
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 {
|
.input-lettre.lettre-bien-place {
|
||||||
|
@ -132,6 +155,11 @@ body {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.input-lettre.input-lettre-vide:hover,
|
||||||
|
.input-lettre.input-lettre-vide:active {
|
||||||
|
cursor: initial;
|
||||||
|
}
|
||||||
|
|
||||||
#regles-panel {
|
#regles-panel {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
|
Loading…
Reference in a new issue