fix(unity-bootstrap-theme): fix form fields

fix form fields border that's causing jumping

Description

Description of problem: In Webforms, when a user focuses on a field, a 1px border is added. This changes the element height, and causes the content to jump.

Solution: By replacing the added 1px border on the focus state with 1px of box-shadow of the same color, the jumpiness when clicking into the fields is eliminated.

While working on this, I encountered another issue with the success and alert fields, given both have an 8px bottom border. In order to retain the 8px bottom border, I had to create focus states of these individual styles.

Checklist

[x] Unity project successfully builds from root yarn install & yarn build
[x] Commits do not contain multiple scopes
[x] Add/updated examples
[x] Accessibility checks

Browsers

[x] Chrome
[x] Safari
[x] Firefox
[x] Edge

Images

Field focus state border causing jumpiness

field-borders-growing

fixed field focus states

field-borders-fixed

ASU / asu-unity-stack