Box

Generic container primitive used for alignment and spacing.

Usage

import { Box } from 'atomic-layout'
 
<Box>Fun Content in Here</Box>

Alignment

flexDirection
flexShrink
flexGrow
flexWrap
align
alignItems
alignContent
justify
justifyItems
justifyContent
place
placeItems
placeContent

Sizing

minHeight
maxHeight
height
minWidth
maxWidth
width

Spacing

margin
marginVertical
marginHorizontal
marginTop
marginRight
marginLeft
marginBottom
padding
paddingVertical
paddingHorizontal
paddingTop
paddingRight
paddingLeft
paddingBottom

Padding example:

<Box padding={10}> ... </Box>