Procuramos facilitar algumas coisas na hora de inserir e validar dados. :D
GA IN TI ME
O GainTime simplificou a estilização de formulários assumindo que, se o form
é da classe .gt-form
, todos os seus inputs
devem ser estilizados. Aplica max-width: 500px
.
Experimente adicionar as classes .small
, .medium
, .large
ou .full
.
<form
class="gt-form"
action="myAction"
method="post">
...
</form>
Substituindo .gt-form
por .gt-form-inline
você vai conseguir formulários com todo o seu conteúdo alinhado à esquerda.
É aplicado display: inline-block; width: auto
a todos (*
) os elementos de .gt-form-inline
.
<form
class="gt-form-inline"
action="myAction"
method="post">
...
</form>
Como desabilitamos a estilização outline
padrão dos browsers, atribuimos características próprias a alguns status.
checkbox e radio
são alinhados horizontalmente por padrão.textarea
é desabilitado o resize horizontal por padrão.
Caso você queira aplicar a estilização dada aos inputs do .gt-form
a inputs livres, basta adicionar a eles a classe .field
.
<input
class="field"
type="text">
Adicionamos alguns testes de validação ao gaintime. Para ativar, basta adicionar o atributo data-validate
ao input
com uma das seguintes opções:
Confira o nosso BR-validator. OBS: Se você já vai utilizar o GainTime, não precisa importar o BR-validator, pois ele já faz parte do GainTime.
As validações acontecem on blur
.
<input
type="text"
data-validate="cpf">