split
split copied to clipboard
[Split-Grid] Gutters should be used in a two-dimensional way.

It's easy to create a 2x2 split blocks with split-grid.
But speaking of grid, it's expected to define gutter with two dimensions.
For example, these four blocks are expected to be split by four gutters, allowing top column gutter and bottom column gutter shits seperately.
import Split from 'split-grid'
Split({
columnGutters: [{
track: 1,
span: [0,1], // from row 0 to row 1
element: document.querySelector('.gutter-col-1'),
}],
columnGutters: [{
track: 1,
span: [1,2],
element: document.querySelector('.gutter-col-2'),
}],
rowGutters: [{
track: 1,
span: [0,1], // from column 0 to column 1
element: document.querySelector('.gutter-row-1'),
}],
rowGutters: [{
track: 1,
span: [1,2],
element: document.querySelector('.gutter-row-2'),
}]
})