diff --git a/src/components/FormInput/FormInput.tsx b/src/components/FormInput/FormInput.tsx index 260e22b..dbadb60 100644 --- a/src/components/FormInput/FormInput.tsx +++ b/src/components/FormInput/FormInput.tsx @@ -12,27 +12,27 @@ const FormInput = () => { nascimento: "", tel: "", instagram: "", + termos: false, }, validationSchema: Yup.object({ - nome: Yup.string() - .required() - .test( + nome: Yup.string().required("*Campo Obrigatório"), + /*.test( "is-full-name", "Please enter both your first and last name", function (value: any) { const nameArr = value.split(" "); return nameArr.length >= 2; } - ), - email: Yup.string().email().required(), - cpf: Yup.string().required(), - nascimento: Yup.string().required(), - tel: Yup.string().required(), - instagram: Yup.string().required(), + )*/ email: Yup.string().required("*Campo Obrigatório"), + cpf: Yup.string().required("*Campo Obrigatório"), + nascimento: Yup.string().required("*Campo Obrigatório"), + tel: Yup.string().required("*Campo Obrigatório"), + instagram: Yup.string().required("*Campo Obrigatório"), + termos: Yup.boolean().required("*").isTrue(), }), onSubmit: function (values) { alert(`You are registered! Name: ${values.nome}. Email: ${values.email}. Profession: ${values.cpf}. - Age: ${values.nascimento}`); + Age: ${values.nascimento},${values.tel},${values.instagram}`); }, }); @@ -42,7 +42,14 @@ const FormInput = () => {

Preencha o formulário

diff --git a/src/components/FormInput/formInput.module.scss b/src/components/FormInput/formInput.module.scss index 61230e0..5923e83 100644 --- a/src/components/FormInput/formInput.module.scss +++ b/src/components/FormInput/formInput.module.scss @@ -7,3 +7,11 @@ flex-direction: column; margin-bottom: 10px; } +.textForm { + display: flex; + flex-direction: row; +} +.errorFormik { + margin-left: 80px; + color: red; +}