This work is an adaptation from the original Flexbox Grid created by @kristoferjoseph.

Grid based on the flex display property. Check the documentation

By trying the Flexbox Grid we saw the internal need to a SASS version of it. Thanks to the good work of Kristopher Joseph, we forked his project and sassified it.

npm i flexboxgrid-sass --save

bower install --save flexboxgrid-sass

To modify the Flexbox grid, declare the following variables on your layout .scss

$flexboxgrid-grid-columns: 12;

$flexboxgrid-gutter-width: 1rem;

$flexboxgrid-outer-margin: 1rem;

You can modify, remove or create breakpoints before generate the final CSS.

$flexboxgrid-breakpoints:
  sm 48rem,
  md 64rem,
  lg 80rem,
  xlg 90rem,
  newbreakpoint 120rem;