Add .iui-field base class for inputs

[FlyersPh9]

Changes

• Add .iui-field class which gives base styling (background-color, color, border-color, data-iui-variant, etc) for many inputs (<button>, <input>, <textarea>, <select>). This reduces duplicate CSS and helps keep styling consistent.
• <input>, <textarea>, <select> now have matching hover state with <button>.
• <input>, <textarea>, <select> text styling is different:
  • Disabled text is grayed out rather than not.
  • Disabled placeholder text no longer appears, otherwise it matches too closely to disabled text.

Testing

• CSS test images.
• React test images.

Docs

• Changesets

After PR TODOs

• When an input is disabled, don't show placeholder text because it is too similar to disabled value text color.

[FlyersPh9]

@mayank99 I continued working on this yesterday and I'm up to 22 files changed locally (haven't pushed yet), starting to be concerned that the scope has creeped too far:

• Button mixins have been removed so all files other than button.scss have been deleted.
• The removal of these mixins caused having to make changes in breadcrumbs, pagination, etc. because they used these mixins.

[mayank99]

I think it makes sense to keep the PRs separate, to make the review easier.

1. This PR changes the class names. (CSS output)
2. One PR removes the mixins from buttons. (internal Sass refactor)

You can even chain one PR to the other one, by creating a branch on top of it and changing the base. (Read more: 1, 2)

[FlyersPh9]

Unrelated to this PR, but fixes a broken test.

[FlyersPh9]

Unrelated to this PR, but fixes a button issue.

[mayank99]

LGTM!

I would maybe wait for another approval though, just to make sure nothing was missed.

cc @Ben-Pusey-Bentley

[Ben-Pusey-Bentley]

LGTM.

[r100-stack]

LGTM! 🚀

Just a few more comments of which some are nit/optional.