Describe the bug
It looks like when we switched from using margins to the gap style property in the EuiFlexGroup component, we inadvertently changed the gutterSize="m" prop from being $euiSize (16px, link) to euiTheme.size.m (12px, link). The correct value should be euiTheme.size.base (16px).
Impact and severity
This affects all uses of the EuiFlexGroup component when gutterSize="m" is in use.
To Reproduce
View the EUI flex group gutter sizing documentation and see the space between flex items in the medium gutter size example.
Expected behavior
A medium gutter should result in a 16px space. To do so, we need to change the component's gap style to use euiTheme.size.base instead of euiTheme.size.m.
Additional context
CCing @markov00, as this relates to a discussion we are having here: elastic/kibana#167703
Describe the bug
It looks like when we switched from using margins to the
gapstyle property in theEuiFlexGroupcomponent, we inadvertently changed thegutterSize="m"prop from being$euiSize(16px, link) toeuiTheme.size.m(12px, link). The correct value should beeuiTheme.size.base(16px).Impact and severity
This affects all uses of the
EuiFlexGroupcomponent whengutterSize="m"is in use.To Reproduce
View the EUI flex group gutter sizing documentation and see the space between flex items in the medium gutter size example.
Expected behavior
A medium gutter should result in a 16px space. To do so, we need to change the component's
gapstyle to useeuiTheme.size.baseinstead ofeuiTheme.size.m.Additional context
CCing @markov00, as this relates to a discussion we are having here: elastic/kibana#167703