Inset

Inset layout applies positive spacing scale to its child nodes.

Props

NameTypeDescriptionDefault
space'0rem' | '0.125rem' | '0.25rem' | '0.5rem' | '1rem' | '1.5rem' | '2rem' | '3rem' | '4rem' | '5rem'Applies the spacing scale to all sides.'0rem'
horizontal'0rem' | '0.125rem' | '0.25rem' | '0.5rem' | '1rem' | '1.5rem' | '2rem' | '3rem' | '4rem' | '5rem'Applies the spacing scale to the left and right sides.'0rem'
vertical'0rem' | '0.125rem' | '0.25rem' | '0.5rem' | '1rem' | '1.5rem' | '2rem' | '3rem' | '4rem' | '5rem'Applies the spacing scale to the top and bottom sides.'0rem'
top'0rem' | '0.125rem' | '0.25rem' | '0.5rem' | '1rem' | '1.5rem' | '2rem' | '3rem' | '4rem' | '5rem'Applies the spacing scale to the top side.'0rem'
right'0rem' | '0.125rem' | '0.25rem' | '0.5rem' | '1rem' | '1.5rem' | '2rem' | '3rem' | '4rem' | '5rem'Applies the spacing scale to the right side.'0rem'
bottom'0rem' | '0.125rem' | '0.25rem' | '0.5rem' | '1rem' | '1.5rem' | '2rem' | '3rem' | '4rem' | '5rem'Applies the spacing scale to the bottom side.'0rem'
left'0rem' | '0.125rem' | '0.25rem' | '0.5rem' | '1rem' | '1.5rem' | '2rem' | '3rem' | '4rem' | '5rem'Applies the spacing scale to the left side.'0rem'
Required
children
React.ReactNodeCustom content inside the inset.-

Examples

Basic usage

Custom sides