A Simple SCSS Grid Based on CSS-Grid or Flexbox
npm install grid-scheibo
 !npm
!npm
Demo (https://scheibome.github.io/grid-scheibo/)
~~~
npm install grid-scheibo
~~~
---
#### Grid with CSS Grid
~~~scss
@import
'../../../node_modules/grid-scheibo/source/variables',
'../../../node_modules/grid-scheibo/source/cssgrid-scheibo';
~~~
#### Grid with Flexbox
~~~scss
@import
'../../../node_modules/grid-scheibo/source/variables',
'../../../node_modules/grid-scheibo/source/grid-scheibo';
~~~
---
Insert your settings before the import
~~~scss
// add own gutter size
$col-gutter-size: 2rem;
// your grid with CSS-Grid
$grid-setup: (
'1-1': '1fr 1fr',
'1-1-1': '1fr 1fr 1fr',
'1-2-1': '1fr 2fr'
);
// your grid with flexbox
$col-widths: (
'1\\/8': '1/8',
'2\\/8': '2/8',
'3\\/8': '3/8',
'4\\/8': '4/8',
'5\\/8': '5/8',
'6\\/8': '6/8',
'7\\/8': '7/8',
'full': 100%
);
// your breaks
$col-grid-breaks: (
tablet: '900px',
desktop: '1024px',
wide: '1400px'
);
// for using CSS-Grid
@import '../../../node_modules/grid-scheibo/source/cssgrid-scheibo';
// for using Flexbox
@import '../../../node_modules/grid-scheibo/source/grid-scheibo';
~~~
#### Grid with CSS-Grid
~~~html
#### Grid with Flexbox
##### o-row--nogutter
~~~html
##### o-row--between
~~~html
##### o-row--between & o-row--vertical-align
~~~html
##### o-row--row-reverse
~~~html