[OUDS] Missing `.was-validated` selector for text-input and text-area

[hannahiss]

Prerequisites

• I have searched for duplicate or closed issues
• I have validated any HTML to avoid common problems
• I have read the contributing guidelines

Describe the issue

In forms, on text inputs and text areas, error messages and styles must be displayed only when:

• field is :invalid and . was-validated has been added to a parent (usually the form)
• .is-invalid is added to the field

Two problems:

• Error messages are displayed when field is :invalid even if .was-validated hasn't been added to a parent
• Negative muted background color and error icon whould be applied when . was-validated has been added to a parent

Reduced test cases

Make a form with a required text-input: the error message is displayed even when the form hasn't been validated yet.

What we have, before clicking on submit button (whithout .was-validated on the form)`:

What we should have:

What we have, after clicking on submit button (which adds .was-validated to the form)`:

What we should have:

What operating system(s) are you seeing the problem on?

Windows

What browser(s) are you seeing the problem on?

Chrome

What version of Boosted are you using?

1.0.0 (OUDS)