@commercetools-uikit/spacings-inset

Inset

Description

If you want to learn more about the spacing components take a look at this article.

Usage

import SpacingsInset from '@commercetools-uikit/spacings-inset';

<SpacingsInset scale="m">{/* Container with padding 🎉  */}</SpacingsInset>;

Using Spacings preset

Inset spacing can be imported and used via spacings preset as well.

import Spacings from '@commercetools-uikit/spacings';

<Spacings.Inset scale="m">{/* Container with padding 🎉  */}</Spacings.Inset>;

Properties

Props	Type	Required	Values	Default
scale	String	-	['xs', 's', 'm', 'l', 'xl']	x
height	String	-	collapsed, expanded	collapsed
children	PropTypes.node	-	-	-

Scales

Scale	Pixel
xs	4
s	8
m	16
l	24
xl	32