Skip to content

[EuiFlexGroup] gutterSize="m" should be 16px, not 12px #7244

@MichaelMarcialis

Description

@MichaelMarcialis

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

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions