beautification du form de demande de contact

This commit is contained in:
Medenos 2022-09-27 23:46:26 -04:00
parent 014bca24d8
commit 9fa0c948d9
2 changed files with 64 additions and 27 deletions

View File

@ -1,44 +1,44 @@
const ContactForm = () =>{
return (
<section>
<form method="post" class="form-horizontal" role="form">
<h4 class="text-center text-white">Demander une rencontre!</h4>
<div class="form-group">
<div class="col-md-12">
<label class="text-white">Nom*</label>
<input class="form-control" />
{/* <span asp-validation-for="Name" class="text-danger"></span> */}
<div className="contact-form-container">
<form method="post" className="form-horizontal" role="form">
<h4 className="text-center">Demander une rencontre!</h4>
<div className="form-group">
<div className="col-md-12">
<label >Nom*</label>
<input className="form-control contact-form-input" />
{/* <span asp-validation-for="Name" className="text-danger"></span> */}
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<label class="text-white">Email*</label>
<input class="form-control" />
{/* <span asp-validation-for="Email" class="text-danger"></span> */}
<div className="form-group">
<div className="col-md-12">
<label >Email*</label>
<input className="form-control contact-form-input" />
{/* <span asp-validation-for="Email" className="text-danger"></span> */}
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<label class="text-white">Téléphone*</label>
<input class="form-control" />
{/* <span asp-validation-for="Phone" class="text-danger"></span> */}
<div className="form-group">
<div className="col-md-12">
<label >Téléphone*</label>
<input className="form-control contact-form-input" />
{/* <span asp-validation-for="Phone" className="text-danger"></span> */}
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<label class="text-white">Message</label>
<input class="form-control" rows="3"/>
{/* <span asp-validation-for="Message" class="text-danger"></span> */}
<div className="form-group">
<div className="col-md-12">
<label >Message</label>
<textarea className="form-control contact-form-input" rows="3"/>
{/* <span asp-validation-for="Message" className="text-danger"></span> */}
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-12">
<button type="submit" class="btn btn-default bg-success">Demande</button>
<div className="form-group">
<div className="col-md-offset-2 col-md-12">
<button type="submit" className="btn btn-default bg-success contact-form-btn">Demande</button>
</div>
</div>
</form>
</section>
</div>
);
}

View File

@ -111,7 +111,26 @@ html{
background-color: plum;
}
.contact-form-container{
padding:3% 5% 3% 5%;
color:black;
background-color: beige;
}
.contact-form-input{
border:3px solid rgba(0,0,0,.25);
/* box-shadow: 1px 2px rgba(0, 0, 0, .25); */
}
.contact-form-btn{
margin-top:3%;
color:beige;
background-color: purple !important;
}
.contact-form-btn:hover{
background-color: plum !important;
}
.footer-container{
color: black;
@ -160,4 +179,22 @@ html{
padding-right: 20px;
background-color: rgba(255, 255, 255, .75);
}
.contact-form-container{
margin-bottom: 35px;
margin-top: 35px;
}
.contact-form-input{
min-height: 50px;
}
.contact-form-btn{
margin-left: 10%;
margin-right:10%;
height:75px;
width: 80%;
}
}