beautification du form de demande de contact
This commit is contained in:
parent
014bca24d8
commit
9fa0c948d9
@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -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%;
|
||||
}
|
||||
|
||||
|
||||
}
|
Loading…
Reference in New Issue
Block a user