Edit page
Flex
An abstraction over a Flexbox 🚀
Defines a Flex container (Flex) and a Flex child (Flex.Item). You should use Flex.Item with a parent Flex wrapping it.
Also comes with the ability to quickly pass a background color, width, or height.
Flex
children
Reactnode
required
Must pass it a child.
className
String | undefined
Pass it any class to extend styling.
height
String | undefined
width
String | undefined
background
String | undefined
direction
"row" | "row-reverse" | "column" | "column-reverse" | undefined
wrap
"nowrap" | "wrap" | "wrap-reverse" | undefined
justifyContent
"flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly" | undefined
alignItems
"flex-start" | "flex-end" | "center" | "stretch" | "baseline" | undefined
alignContent
"flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "stretch" | undefined
Flex Item
children
Reactnode
required
Must pass it a child.
className
String | undefined
Pass it any class to extend styling.
height
String | undefined
width
String | undefined
background
String | undefined
flex
String | undefined
order
Number | undefined
grow
Number | undefined
shrink
Number | undefined
basis
String | undefined
alignSelf
"flex-start" | "flex-end" | "center" | "stretch" | "baseline" | "auto" | undefined