Flex

Thin abstraction over a flex div.

Mantine only sets display: flex if nothing else is set.

props:

• the direction, horizontal (row) by default. We may set it as vertical (column), and switch to horizontal on desktop.
• the gap, defaults to 0, due to matching a regular flex.
• justify, aka main axis alignment, default to flex-start, due to matching a regular flex.
• align, aka cross-axis alignment, defaults to stretch, due to matching regular flex.

<Flex
 direction=	{{ base: 'column',sm: 'row' }}
 gap=		{{ base: 'sm', 	sm: 'lg' }}
 justify=	{{ base: 'flex-start', 	sm: 'space-between' }}
>