Nulogy's components use styled-system to apply groups of style props to different types of components. These props correspond to their css equivalents and allow individual manipulation of a component's style.
Category | Props |
---|---|
space | margin, marginTop, marginRight, marginBottom, marginLeft, marginX, marginY, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, paddingX, paddingY, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, |
layout | width, height, minWidth, minHeight, maxWidth, maxHeight, display, verticalAlign, size |
typography | fontFamily, fontSize, fontWeight, lineHeight, letterSpacing, fontStyle, textAlign |
colour | color, backgroundColor, bg |
border | border, borderWidth, borderStyle, borderColor, borderRadius, borderTop, borderRight, borderBottom, borderLeft, borderX, borderY, |
position | position, zIndex, top, right, bottom, left |
For more information on each of these props, see the styled-system docs.
To see which props each component includes, see that component's documentation. But in general, the following rules apply: