26 lines
497 B
SCSS
26 lines
497 B
SCSS
|
// _grid.scss
|
||
|
|
.grid {
|
||
|
|
display: grid;
|
||
|
|
gap: 10px;
|
||
|
|
margin: 10px 0;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
@for $i from 2 through 12 {
|
||
|
|
// Create grid-start-* classes for offsets
|
||
|
|
.grid-start-#{$i} {
|
||
|
|
grid-column-start: #{$i};
|
||
|
|
}
|
||
|
|
|
||
|
|
// Create grid-span-* classes for column spans
|
||
|
|
.grid-span-#{$i} {
|
||
|
|
grid-column-end: span #{$i};
|
||
|
|
}
|
||
|
|
|
||
|
|
// Create grid-*col classes for grid columns
|
||
|
|
.grid-#{$i}col {
|
||
|
|
grid-column: span #{$i} / span #{$i};
|
||
|
|
grid-template-columns: repeat(#{$i}, minmax(0, 1fr));
|
||
|
|
}
|
||
|
|
}
|