.grid alias to .autogrid
This commit is contained in:
parent
7bc7e0fb42
commit
54f95cab40
3 changed files with 11 additions and 6 deletions
|
@ -1698,18 +1698,22 @@ ul.is-unstyled, ul.unstyled {
|
||||||
/* recommanded HTML : <div class="autogrid">... some elements ...</div> */
|
/* recommanded HTML : <div class="autogrid">... some elements ...</div> */
|
||||||
/* see https://codepen.io/raphaelgoetter/pen/zzwxEE */
|
/* see https://codepen.io/raphaelgoetter/pen/zzwxEE */
|
||||||
@media (min-width: 480px) {
|
@media (min-width: 480px) {
|
||||||
.autogrid {
|
.autogrid,
|
||||||
|
.grid {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-auto-flow: column;
|
grid-auto-flow: column;
|
||||||
grid-auto-column: 1fr;
|
grid-auto-column: 1fr;
|
||||||
}
|
}
|
||||||
.autogrid.has-gutter {
|
.autogrid.has-gutter,
|
||||||
|
.grid.has-gutter {
|
||||||
grid-column-gap: 1rem;
|
grid-column-gap: 1rem;
|
||||||
}
|
}
|
||||||
.autogrid.has-gutter-l {
|
.autogrid.has-gutter-l,
|
||||||
|
.grid.has-gutter-l {
|
||||||
grid-column-gap: 2rem;
|
grid-column-gap: 2rem;
|
||||||
}
|
}
|
||||||
.autogrid.has-gutter-xl {
|
.autogrid.has-gutter-xl,
|
||||||
|
.grid.has-gutter-xl {
|
||||||
grid-column-gap: 4rem;
|
grid-column-gap: 4rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -4,7 +4,8 @@
|
||||||
/* recommanded HTML : <div class="autogrid">... some elements ...</div> */
|
/* recommanded HTML : <div class="autogrid">... some elements ...</div> */
|
||||||
/* see https://codepen.io/raphaelgoetter/pen/zzwxEE */
|
/* see https://codepen.io/raphaelgoetter/pen/zzwxEE */
|
||||||
|
|
||||||
.autogrid {
|
.autogrid,
|
||||||
|
.grid {
|
||||||
@media (min-width: $tiny) {
|
@media (min-width: $tiny) {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-auto-flow: column;
|
grid-auto-flow: column;
|
||||||
|
|
Loading…
Reference in a new issue