fix(material-experimental/mdc-form-field): fix baseline and handle custom controls better

[devversion]

• Fixes the baseline of form-field controls and their inputs. Previously
  the baseline was incorrect due to flex alignment and vertical-align misuse.
• Improves support for custom form-field controls by ensuring that
  spacing applied to MDC inputs, also applies to custom controls.
  • The same will be needed for the outline appearance, but
    unfortunately we cannot apply any spacing to the infix until we find
    a solution for: text-field: allow floating label to be outside of notched-outline markup material-components/material-components-web#5326

[devversion]

Also just related to this: The outline appearance is not working out very nice in our case due to the limitation with the notched-outline. In summary, we need a way to have the outline cover the whole text-field (prefix, suffixes etc), but have the floating label be relative to the infix container.

I'm unsure if MDC will ever support what we need. We need to keep in mind that we don't implement a standard text-field.. but want to support custom form-field controls. I'm playing with the idea of just working around this.. It should help us reduce the overall CSS workarounds too, so it might be worth.

[jelbourn]

LGTM

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}