React

Level

ExamplesPropsCSS variables

Examples

Simple level layout

Copied to clipboard

Level with gutters

Copied to clipboard

Props

LevelItem props

The LevelItem component accepts the following props.

NameTypeRequiredDefaultDescription
childrenReact.ReactNodenullcontent rendered inside the Level Layout Item

Level props

The Level component accepts the following props.

NameTypeRequiredDefaultDescription
gutter'sm' | 'md' | 'lg'nullAdds space between children.
classNamestring''additional classes added to the Level layout
childrenReact.ReactNodenullcontent rendered inside the Level layout

CSS variables

--pf-l-level--m-gutter--MarginRightl_level_m_gutter_MarginRight1.5rem
--pf-l-level--m-gutter--md--MarginRightl_level_m_gutter_md_MarginRight1rem