Form
Code HTML
<fieldset>
<legend>Contact information :</legend>
<form class="form">
<div class="row">
<div class="md:col-6 col-12">
<div class="form-group has-success">
<label for="Email">Enter email</label>
<input class="" type="email" placeholder="test@mail.com" id="Email">
<div class="feedback">Entrer une adresse email valide</div>
</div>
</div>
<div class="md:col-6 col-12">
<div class="form-group has-error">
<label for="Input">Reason for contact</label>
<select class=" form-select" id="Input">
<option value="Option 1">Help</option>
<option value="Option 2">Thanks</option>
<option value="Option 3">Support</option>
</select>
<div class="feedback">Veuillez choisir une option</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="form-group has-error">
<label for="Message">Message</label>
<textarea class="" placeholder="Your message.." id="Message"></textarea>
<div class="feedback">Le message ne peut pas être vide</div>
</div>
</div>
</div>
<div class="row">
<div class="lg:col-5 sm:col-6 col-12">
<div class="form-group has-error">
<label class="">Date de naissance</label>
<input type="date" name="birthday" id="birthday" class="form-date">
<div class="feedback">Veuillez choisir une date</div>
</div>
</div>
<div class="lg:col-2 sm:col-6 col-12">
<div class="form-group">
<label class="">Color</label>
<input type="color" name="color" id="color" class="form-color">
</div>
</div>
<div class="lg:col-5 col-12">
<div class="form-group has-error">
<label class="">Nature of problem</label>
<select class="form-select" id="select">
<option value="Option 1">Help</option>
<option value="Option 2">Thanks</option>
<option value="Option 3">Support</option>
</select>
<div class="feedback">Veuillez choisir une option</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="form-group has-error">
<label for="number">Enter number</label>
<input class="" type="number" placeholder="number" id="Email">
<div class="feedback">Entrer une valeur numérique valide</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<label for="switch" class="switch">
<input type="checkbox" name="switch" id="switch" checked>
<span class="slider"></span>
<span class="switch-label">Switch toggle</span>
</label>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="form-group has-error">
<input type="file" name="file" id="file">
<div class="feedback">Format de fichier non valide</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="form-group">
<label for="Send">
<input type="checkbox" id="Send">
<span class="-label-body">Send a copy to yourself</span>
</label>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<input class="btn btn-primary" type="submit" value="Submit">
<input class="btn btn-reset" type="reset" value="Reset">
</div>
</div>
</form>
</fieldset>