bachir/d9-eql
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

form input required * ok

Browse Source
This commit is contained in:
ouidade
2022-01-07 15:45:08 +01:00
parent 0e36569b93
commit 214b229992
2 changed files with 408 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/eql/css-compiled/styles.css
+206 -28
View File
@@ -2236,67 +2236,167 @@ a {
flex-direction: row;
flex-wrap: wrap;
flex-basis: auto;
justify-content: space-between;
justify-content: flex-start;
margin-top: 10vh; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form #edit-processed-text {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-titre-du-document {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-titre-du-document:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-titre-du-document label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-titre-du-document input {
width: 100%;
width: 90%;
height: 5rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-titre-du-document input:after {
content: "*";
color: red; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-auteur-s- {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-auteur-s-:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-auteur-s- label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-auteur-s- input {
width: 100%; }
width: 90%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-date-de-parution {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-date-de-parution input {
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-date-de-parution:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-date-de-parution label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-date-de-parution input {
width: 90%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-nombre-de-pages {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%; }
width: 45%;
margin-right: 3rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-nombre-de-pages label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-nombre-de-pages input {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-nom-de-la-revue-et-de-l-editeur {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
margin-top: 2rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-nom-de-la-revue-et-de-l-editeur input {
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-nom-de-la-revue-et-de-l-editeur:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-nom-de-la-revue-et-de-l-editeur label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-nom-de-la-revue-et-de-l-editeur input {
width: 90%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-type-de-document-revue-article-etc- {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-type-de-document-revue-article-etc- input {
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-type-de-document-revue-article-etc-:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-type-de-document-revue-article-etc- label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-type-de-document-revue-article-etc- input {
width: 90%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-resume-de-la-ressource {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
margin-top: 2rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-resume-de-la-ressource textarea {
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-resume-de-la-ressource:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 1rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-resume-de-la-ressource label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-resume-de-la-ressource div {
width: 90%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-resume-de-la-ressource div textarea {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-_-ou-4-mots-ou-expression-cles-pour-identifier-le-sujet {
margin-top: 2rem; }
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-_-ou-4-mots-ou-expression-cles-pour-identifier-le-sujet label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-_-ou-4-mots-ou-expression-cles-pour-identifier-le-sujet input {
width: 100%; }
width: 90%;
height: 3rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-url-vers-une-video-ou-un-site-internet {
margin-top: 2rem; }
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-url-vers-une-video-ou-un-site-internet label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-url-vers-une-video-ou-un-site-internet input {
width: 100%; }
width: 90%;
height: 3rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-courriel {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%; }
width: 47%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-courriel:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-courriel label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-courriel input {
width: 100%; }
width: 90%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-telephone {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-telephone input {
width: 47%;
margin-right: 3rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-telephone:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-telephone label {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form .form-item-telephone input {
width: 90%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form #edit-actions {
width: 100%; }
.path-webform .region-content #webform-submission-deposer-une-contribution-add-form #edit-actions input {
@@ -2317,48 +2417,126 @@ a {
flex-direction: row;
flex-wrap: wrap;
flex-basis: auto;
justify-content: space-between;
justify-content: flex-start;
margin-top: 10vh; }
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-processed-text {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-intitule-de-l-offre-de-service {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-intitule-de-l-offre-de-service:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-intitule-de-l-offre-de-service label {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-intitule-de-l-offre-de-service input {
width: 100%;
width: 90%;
height: 5rem; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-structure {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-structure:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-structure label {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-structure input {
width: 100%; }
width: 90%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-localisation {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-localisation:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-localisation label {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-localisation input {
width: 90%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form div {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form div .form-item-description {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form div .form-item-description label {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form div .form-item-description textarea {
width: 90%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-description {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-description textarea {
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-description label {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-description textarea {
width: 90%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-lien--wrapper {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-lien--wrapper .form-item-lien-url {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-lien--wrapper .form-item-lien-url input {
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-lien--wrapper .form-item-lien-url:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-lien--wrapper .form-item-lien-url label {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-lien--wrapper .form-item-lien-url input {
width: 90%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-courriel {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%; }
width: 47%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-courriel:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-courriel label {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-courriel input {
width: 100%; }
width: 90%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-telephone {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-telephone input {
width: 47%;
margin-right: 3rem; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-telephone:after {
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-telephone label {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form .form-item-telephone input {
width: 90%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-actions {
width: 100%; }
.path-webform .region-content #webform-submission-offre-de-service-add-form #edit-actions input {
web/themes/custom/eql/scss/pages/_webform.scss
+202 -23
View File
@@ -21,7 +21,7 @@
flex-direction: row;
flex-wrap: wrap;
flex-basis: auto;
justify-content: space-between;
justify-content: flex-start;
margin-top: 10vh;
// input:focus ~ label,
// input:not(:placeholder-shown) ~ label {
@@ -44,15 +44,21 @@
}
.form-item-titre-du-document{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{
// overflow: visible;
width: 100%;
width: 90%;
height: 5rem;
// ::placeholder{
@@ -71,67 +77,161 @@
}
.form-item-auteur-s-{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{
width: 100%;
width: 90%;
}
}
.form-item-date-de-parution{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{
width: 100%;
width: 90%;
}
}
.form-item-nombre-de-pages{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%;
margin-right: 3rem;
label{width: 100%;}
input{
// margin-top: 1rem;
width: 100%;
}
}
.form-item-nom-de-la-revue-et-de-l-editeur{
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
margin-top: 2rem;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{
width: 100%;
width: 90%;
}
}
.form-item-type-de-document-revue-article-etc-{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{
width: 100%;
width: 90%;
}
}
.form-item-resume-de-la-ressource{
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
margin-top: 2rem;
textarea{width: 100%;}
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 1rem;
}
label{width:100%}
div{
width: 90%;
textarea{width: 100%;}
}
}
.form-item-_-ou-4-mots-ou-expression-cles-pour-identifier-le-sujet{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
label{width: 100%;}
input{
width: 100%;
width: 90%;
height: 3rem;
}
}
.form-item-url-vers-une-video-ou-un-site-internet{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
label{width: 100%;}
input{
width: 100%;
width: 90%;
height: 3rem;
}
}
.form-item-courriel{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%;
input{width: 100%;}
width: 47%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{width: 90%;}
}
.form-item-telephone{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%;
input{width: 100%;}
width: 47%;
margin-right: 3rem;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{width: 90%;}
}
#edit-actions{
// display: inline-flex;
@@ -159,7 +259,7 @@
flex-direction: row;
flex-wrap: wrap;
flex-basis: auto;
justify-content: space-between;
justify-content: flex-start;
margin-top: 10vh;
// input:focus ~ label,
// input:not(:placeholder-shown) ~ label {
@@ -171,56 +271,135 @@
}
.form-item-intitule-de-l-offre-de-service{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{
width: 100%;
width: 90%;
height: 5rem;
}
}
.form-item-structure{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{
width: 100%;
width: 90%;
}
}
.form-item-localisation{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%; }
input{
width: 100%;
width: 90%;
}
}
div{
width: 100%;
.form-item-description{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
label{width: 100%;}
textarea{
width: 90%;
}
}
}
.form-item-description{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
label{width: 100%;}
textarea{
width: 100%;
width: 90%;
}
}
#edit-lien--wrapper{
width: 100%;
.form-item-lien-url{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 100%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{
width: 100%;
width: 90%;
}
}
}
.form-item-courriel{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%;
input{width: 100%;}
width: 47%;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{width: 90%;}
}
.form-item-telephone{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2rem;
width: 45%;
input{width: 100%;}
width: 47%;
margin-right: 3rem;
&:after{
content: "*";
color: red;
font-size: 2rem;
padding-left: 0.5rem;
}
label{width: 100%;}
input{width: 90%;}
}
#edit-actions{
// display: inline-flex;