scss: reduce a little bit flex columns to work around alignment issues (#89903)
gitea/gadjo/pipeline/head This commit looks good
Details
gitea/gadjo/pipeline/head This commit looks good
Details
This commit is contained in:
parent
35aa41eec9
commit
07d3c458a2
|
@ -5,6 +5,7 @@
|
|||
|
||||
// Publik vars
|
||||
$fx-grid-gutter: 1rem;
|
||||
$fx-grid-gutter-and-epsilon: $fx-grid-gutter + 0.00001rem;
|
||||
$fx-grid-cell-min-size: 10em; // for .fx-grid--auto
|
||||
$fx-grid-mobile-limit: $very-small-limit;
|
||||
$fx-grid-tablet-limit: $grid-mobile-limit;
|
||||
|
@ -50,20 +51,20 @@ $min-grid-desktop-viewport: "min-width: #{$fx-grid-tablet-limit + 1}";
|
|||
@for $i from 2 through $max-cols-mobile {
|
||||
.fx-grid--#{$i} > *,
|
||||
[class*="fx-grid--"][class*="--m#{$i}"] > * {
|
||||
flex-basis: calc(#{100%/$i} - #{$fx-grid-gutter});
|
||||
flex-basis: calc(#{100%/$i} - #{$fx-grid-gutter-and-epsilon});
|
||||
}
|
||||
}
|
||||
@media ($min-grid-tablet-viewport) {
|
||||
@for $i from 2 through $max-cols-tablet {
|
||||
[class*="fx-grid--"][class*="--t#{$i}"] > * {
|
||||
flex-basis: calc(#{100%/$i} - #{$fx-grid-gutter});
|
||||
flex-basis: calc(#{100%/$i} - #{$fx-grid-gutter-and-epsilon});
|
||||
}
|
||||
}
|
||||
}
|
||||
@media ($min-grid-desktop-viewport) {
|
||||
@for $i from 2 through $max-cols-desktop {
|
||||
[class*="fx-grid--"][class*="--d#{$i}"] > * {
|
||||
flex-basis: calc(#{100%/$i} - #{$fx-grid-gutter});
|
||||
flex-basis: calc(#{100%/$i} - #{$fx-grid-gutter-and-epsilon});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -75,7 +76,7 @@ $min-grid-desktop-viewport: "min-width: #{$fx-grid-tablet-limit + 1}";
|
|||
@for $j from 1 through $i {
|
||||
> .size--#{$j}-#{$i},
|
||||
> [class*="size--"][class*="--m#{$j}-#{$i}"] {
|
||||
flex-basis: calc( #{100%*$j/$i} - #{$fx-grid-gutter});
|
||||
flex-basis: calc( #{100%*$j/$i} - #{$fx-grid-gutter-and-epsilon});
|
||||
flex-grow: 0;
|
||||
}
|
||||
}
|
||||
|
@ -84,7 +85,7 @@ $min-grid-desktop-viewport: "min-width: #{$fx-grid-tablet-limit + 1}";
|
|||
@for $i from 1 through $max-cols-tablet {
|
||||
@for $j from 1 through $i {
|
||||
> [class*="size--"][class*="--t#{$j}-#{$i}"] {
|
||||
flex-basis: calc( #{100%*$j/$i} - #{$fx-grid-gutter});
|
||||
flex-basis: calc( #{100%*$j/$i} - #{$fx-grid-gutter-and-epsilon});
|
||||
flex-grow: 0;
|
||||
}
|
||||
}
|
||||
|
@ -94,7 +95,7 @@ $min-grid-desktop-viewport: "min-width: #{$fx-grid-tablet-limit + 1}";
|
|||
@for $i from 1 through $max-cols-desktop {
|
||||
@for $j from 1 through $i {
|
||||
> [class*="size--"][class*="--d#{$j}-#{$i}"] {
|
||||
flex-basis: calc( #{100%*$j/$i} - #{$fx-grid-gutter});
|
||||
flex-basis: calc( #{100%*$j/$i} - #{$fx-grid-gutter-and-epsilon});
|
||||
flex-grow: 0;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue