react-ui
react-ui copied to clipboard
Get rid of padding alignment hack once Safari supports `align-items: baseline` for blank inputs
See https://bugs.webkit.org/show_bug.cgi?id=142968
-
Change default label and field alignment to real baseline:
--rui-form-field-horizontal-label-vertical-alignment: baseline; --rui-form-field-horizontal-field-vertical-alignment: baseline; --rui-form-field-horizontal-label-padding-y: 0; -
Get rid of
FormLayoutCustomField'sinnerFieldSizeprop.
Make sure various label and field alignment scenarios are still supported by us—possible scenarios may narrow down by the change. Consult with src/lib/styles/tools/form-fields/_box-field-layout.scss comments.
Current state of baseline field alignment in Safari 14.0.3:
Almost perfect (quick, no code tweaks) baseline alignment in Firefox:
Be careful when tap target is involved in calculations:
Since this works also for FormLayoutCustomFields, we could get rid of their innerFieldSize prop:
Comes from #263.