Eu comprei um CSS e estou tentando aplicar no meu site, o cass que eu comprei tem uma esquema de validação no form onde ele circula o form com uma linha vermelha e coloca um X dentro da caixa de texto.
Vou colocar uma imagem aqui para ficar fácil de entende, essa é do template que eu comprei.
Agora, o meu fica dessa forma:
A diferença do HTML é a inclusão de um ::before e de uma classe (que eu acho q é ela que coloca o before, mas não sei bem como isso funciona, estou aprendendo)
O componente do form fica em um , segue o exemplo do primeiro componente já com a validação de erro ativa:
<div class="form-group has-error">
::before
<label class="sr-only" for="Nome">Nome</label>
<input class="input-validation-error form-control input-lg required text-box single-line" data-val="true" data-val-required="O campo Nome é obrigatório." id="name" name="Nome" placeholder="Name" type="text" value=""> <ul class="parsley-errors-list" id="parsley-id-1125"></ul>
</div>
O ::before é o "X" que eu quero colocar, ele tem o seguinte css:
.contact-form .has-error:before {
content: "\f00d";
color: #d2322d;
}
Porque no meu projeto ele tem um quadrado e no projeto comprado é um X?
content: "\f00d";
) normalmente vem de arquivos de fonte. Você incluiu todas as fontes que vieram no template no seu projeto?