10.39.3 • Published 4 years ago
@commercetools-uikit/inset-squish v10.39.3
Inset Squish
Description
If you want to learn more about the spacing components take a look at this article.
Usage
import SpacingsInsetSquish from '@commercetools-uikit/spacings-inset-squish';
// button component that uses SpacingsInsetSquish
<div className={styles.background}>
<SpacingsInsetSquish scale="m">
<Text.Detail>{/* SUBMIT */}</Text.Detail>
</SpacingsInsetSquish>
</div>;
Using Spacings preset
InsetSquish spacing can be imported and used via spacings
preset as well.
import Spacings from '@commercetools-uikit/spacings';
// button component that uses SpacingsInsetSquish
<div className={styles.background}>
<Spacings.InsetSquish scale="m">
<Text.Detail>{/* SUBMIT */}</Text.Detail>
</Spacings.InsetSquish>
</div>;
Properties
Props | Type | Required | Values | Default |
---|---|---|---|---|
scale | String | - | ['s', 'm', 'l'] | m |
children | PropTypes.node | - | - | - |
Scales
Scale | Pixel |
---|---|
s | 4 x 8 |
m | 8 x 16 |
l | 16 x 32 |
10.39.3
4 years ago
0.0.0-canary-202010474929
4 years ago
0.0.0-canary-202010414016
4 years ago
10.39.2
4 years ago
0.0.0-canary-2020103182138
4 years ago
0.0.0-canary-2020103203835
4 years ago
0.0.0-canary-2020103141922
4 years ago
10.39.1
4 years ago
0.0.0-canary-202010215528
4 years ago
0.0.0-canary-202092995452
4 years ago