Refactor: Update form validation

[saashapina]

• update submit form validation with consistent validation styles

Testing

• Is your apprenticeship a paid opportunity field
  • yes is required: returns "Your apprenticeship must be paid"
• Company field
  • field is required: returns "Please enter your company name"
• Company website field
  • field is required: returns "Please enter company website"
  • field must be a url: returns "Please enter a valid URL"
• Category field
  • field is required: returns "Please select a category"
• Duration field
  • fied is required: returns "Please enter a duration"
  • must be greater than 0: returns "Please enter a value greater than 0"
  • Please enter a value
• Summary field
  • field is requred: returns "Please enter a summary of the apprenticeship"
• Location field
  • field is required: returns "Please enter a location"
• Application Link
  • field is required: returns "Please enter a link to the application"
  • field must be a url: returns "Please enter a valid URL"
• Past apprentice email
  • field is required: returns "Please enter a past apprentice email"
  • field must be an email: returns "Please enter a valid email"
• Email
  • field is required: returns "Please enter an email address"
  • field must be an email: returns "Please enter a valid email address"

[cypress[bot]]

---

Test summary

13 • 0 • 0 • 0

---

Run details

Project	apprentice-at
Status	Passed
Commit	79cc395d58
Started	Feb 24, 2022 6:20 PM
Ended	Feb 24, 2022 6:22 PM
Duration	01:28 💡
OS	Linux Ubuntu - 20.04
Browser	Custom chromium 90

View run in Cypress Dashboard ➡️

---

This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

[jonoliver]

👏 This is awesome @saashapina!

The UI behavior is much more consistent and jquery validate makes the configuration easier! 🎉

Two minor things I noticed:

1. when the validation applies to an invalid url, the input value changes to upper case. Not sure if that's intended, but it seems a bit jarring IMO
2. Invalid inputs appear nearly identical to error messages, making it difficult to visually discern between them. Maybe tweaking the error message styling a bit would help?