Passage en flex

This commit is contained in:
Adrien Bourmault 2022-05-05 15:21:31 +02:00
parent 53c49e129e
commit d05403f641
No known key found for this signature in database
GPG Key ID: 6EB408FE0ACEC664
2 changed files with 36 additions and 16 deletions

View File

@ -95,9 +95,17 @@
echo "<input class=\"renseignements\" type=\"text\" id=\"prenom\" name=\"prenom\" required/>";
echo "</div>";
echo "<div class=\"formline\">";
echo "<label class=\"labels\" for=\"adresse\">Adresse postale</label>";
echo "<label class=\"labels\" for=\"adresse\">Adresse</label>";
echo "<input class=\"renseignements\" type=\"text\" id=\"adresse\" name=\"adresse\" required/>";
echo "</div>";
echo "<div class=\"formline\">";
echo "<label class=\"labels\" for=\"codepostal\">Code postal</label>";
echo "<input class=\"renseignements\" type=\"number\" id=\"codepostal\" name=\"codepostal\" required/>";
echo "</div>";
echo "<div class=\"formline\">";
echo "<label class=\"labels\" for=\"ville\">Ville</label>";
echo "<input class=\"renseignements\" type=\"text\" id=\"ville\" name=\"ville\" required/>";
echo "</div>";
echo "<div class=\"formline\">";
echo "<label class=\"labels\" for=\"mail\">Courriel<b>actuel</b></label>";
echo "<input class=\"renseignements\" type=\"email\" id=\"mail\" name=\"mail\" required/>";

View File

@ -610,8 +610,24 @@ h1,h2,h3,h4,h5,h6 {
.formbox {
display: flex;
flex-flow: row wrap;
align-content: flex-start;
flex-direction: column;
text-justify: none;
}
.formline {
display: flex;
flex-direction: row;
flex-wrap: wrap;
padding: 10px;
}
.labels {
flex-basis: 50%;
}
.renseignements, .mode, .captcha_inputs, .mode_radio {
flex-basis: 50%;
padding: 5px;
}
.renseignements {
@ -621,6 +637,14 @@ h1,h2,h3,h4,h5,h6 {
color: black;
}
.captcha_inputs {
all: revert;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
}
.renseignements:focus {
border-bottom: 2px solid var(--a-lec_blue);
border-radius: 3px;
@ -634,6 +658,7 @@ h1,h2,h3,h4,h5,h6 {
font-weight: bold;
border: none;
cursor: pointer;
padding: 5px;
}
.validation:focus {
@ -644,13 +669,6 @@ h1,h2,h3,h4,h5,h6 {
box-shadow: none;
}
.inputs img {
all: unset;
margin-top: 20px;
margin-left: 10px;
width: 30vh;
}
input[type=radio] {
all: revert;
}
@ -675,12 +693,6 @@ input[type=checkbox] {
.mode_radio span {
display: block;
}
form {
margin-right: auto;
margin-left: auto;
width: 50%;
}
}