Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
O problema está aki, alguém me da uma solução por favor, pois assim que meu projeto abre todos meus inputs(retângulos) aparecem com sombra vermelha como se estivessem já errados sem eu digitar realmente a informação errada, então queria que me ajudassem a aparecer a box-shadow vermelha apenas quando realmente executar erro nos inputs.
input:invalid {
box-shadow: 0 0 3px red;
}
Oi Gustavo tudo bem?
Os input que estão marcados como required irão aparecer assim mesmo pois enquanto eles não estiverem preenchidos eles são invalid.
Para resolver isso precisa usar javascript fazendo uns "truquezinhos".
A função javascript desse link https://codepen.io/anon/pen/BvVKza faz com que, além do campo responder visualmente aos requisitos na perda do foco, numa eventual tentativa de envio faça com que os campos todos recebam o CSS indicando seu status.
Desta forma, o feedback acontece no form todo mesmo sem determinado campo ter sido visitado.
Espero ter ajudado!!!!
Olha, André no momento não consigo resolver o erro, pois ainda não vi aulas de javascript, mas logo logo vou tentar resolver, obrigado pela dica.