<Form className={styles.Form}>
  <div className={styles.Fields}>
    <div className={styles.FieldContainer}>
      <Field
        id='name'
        className={styles.Field}
        name='name'
        placeholder='Your Name'
      >
        {({ field, form, meta }) => (
          <FormGroup
            label='Name'
            helperText={meta.touched && meta.error && meta.error}
            intent={meta.touched && meta.error ? 'danger' : 'none'}
            labelInfo='(required)'
          >
            <InputGroup
              value={field.value}
              onChange={(e) =>
              form.setFieldValue('name', e.target.value)
              }
              intent={
              meta.touched && meta.error ? 'danger' : 'none'
              }
              placeholder='Carlos Sanchez'
            />
          </FormGroup>
        )}
      </Field>
    </div>
    <div className={styles.FieldContainer}>
      <Field id='email' className={styles.Field} name='email'>
        {({ field, form, meta }) => (
          <FormGroup
            label='Email'
            helperText={meta.touched && meta.error && meta.error}
            intent={meta.touched && meta.error ? 'danger' : 'none'}
            labelInfo='(required)'
          >
            <InputGroup
              value={field.value}
              onChange={(e) =>
              form.setFieldValue('email', e.target.value)
              }
              intent={
              meta.touched && meta.error ? 'danger' : 'none'
              }
              placeholder='example@mail.com'
            />
          </FormGroup>
        )}
      </Field>
    </div>
  </div>
  <Button
    type='submit'
    className={styles.SubmitButton}
    intent='primary'
    large
    fill
  >
    Submit
  </Button>
</Form>