Helper classes for flexboxgrid
npm install flexboxgrid-helpersdist/flexboxgrid-helpers.min.css
npm i -S flexboxgrid-helpers
.visible-xs-* | Visible | Hidden | Hidden | Hidden
.visible-sm-* | Hidden | Visible | Hidden | Hidden
.visible-md-* | Hidden | Hidden | Visible | Hidden
.visible-lg-* | Hidden | Hidden | Hidden | Visible
.hidden-xs | Hidden | Visible | Visible | Visible
.hidden-sm | Visible | Hidden | Visible | Visible
.hidden-md | Visible | Visible | Hidden | Visible
.hidden-lg | Visible | Visible | Visible | Hidden
.visible-* | display: flex;
.visible-*-block | display: block;
.visible-*-inline | display: inline;
.visible-*-inline-block | display: inline-block;
flex-direction to column
.flex-column | always
.flex-column__xs | Phones (< 48em)
.flex-column__sm | Tablets (≥ 48em)
.flex-column__md | Desktops (≥ 64em)
.flex-column__lg | Desktops (≥ 75em)
.flex-center | Center on horizontal and vertical axes | both below
.flex-center__x | Center on horizontal axe | justify-content: center
.flex-center__y | Center on vertical axe | align-items: center