Added <label> compatibility to groups

This commit is contained in:
Yohn 2024-11-11 22:10:47 -05:00
parent fe78285302
commit b1fcd44b73
241 changed files with 10390 additions and 3095 deletions

View file

@ -1,5 +1,6 @@
@use "sass:string";
@use "sass:map";
@use "sass:math";
@use "../settings" as *; // for spacing, breakpoints, and if columns are defined.
/* Source inspired by https://github.com/sophie-thomas/CSS-Grid/blob/main/assets/scss/grid.scss */
@ -13,6 +14,20 @@
display: grid;
grid-template-columns: repeat($row-columns, 1fr);
gap: var(#{$css-var-prefix}grid-row-gap) var(#{$css-var-prefix}grid-column-gap);
&.align-center {
align-items: center;
}
&.align-start {
align-items: start;
}
&.align-end {
align-items: end;
}
> [class*="col"] > *,
> [class|="col"] > *,
> [class~="col"] > * {
margin: calc(var(#{$css-var-prefix}block-spacing-vertical) * 0.5) auto;
}
}
.row {
max-width: map.get(map.get($breakpoints, "xl"), "viewport");
@ -48,7 +63,7 @@
@each $breakpoint, $values in $breakpoints {
@if $values {
@media (max-width: map.get($values, "viewport")) {
@media (min-width: map.get($values, "viewport")) {
@for $col from 1 through $row-columns {
.col-#{$breakpoint}-#{$col} {
grid-column-end: span $col;