60 lines
2.4 KiB
Text
60 lines
2.4 KiB
Text
.generate-utility-variant(@utility; @variant; @ruleset) when (extract(@variant, 1) = default) {
|
|
@__variant-value: @variant;
|
|
.define-class(~"@{utility}"; @ruleset);
|
|
}
|
|
|
|
.generate-utility-variant(@utility; @variant; @ruleset) when not (extract(@variant, 1) = default) {
|
|
@variant-name: extract(@variant, 1);
|
|
@__variant-value: @variant;
|
|
.define-class(~"@{utility}-@{variant-name}"; @ruleset);
|
|
}
|
|
|
|
.generate-utility-variants(@utility; @variants; @ruleset; @i: 1) when (@i <= length(@variants)) and (length(extract(@variants, @i)) = 1) {
|
|
& {
|
|
.generate-utility-variant(@utility; @variants; @ruleset);
|
|
}
|
|
}
|
|
|
|
.generate-utility-variants(@utility; @variants; @ruleset; @i: 1) when (@i <= length(@variants)) and (length(extract(@variants, @i)) = 2) {
|
|
& {
|
|
@variant: extract(@variants, @i);
|
|
.generate-utility-variant(@utility; @variant; @ruleset);
|
|
}
|
|
.generate-utility-variants(@utility; @variants; @ruleset; @i + 1);
|
|
}
|
|
|
|
.generate-screen-utility-variant(@utility; @variant; @screen-name; @ruleset) when (extract(@variant, 1) = default) {
|
|
@__variant-value: @variant;
|
|
.define-class(~"@{screen-name}\:@{utility}"; @ruleset);
|
|
}
|
|
|
|
.generate-screen-utility-variant(@utility; @variant; @screen-name; @ruleset) when not (extract(@variant, 1) = default) {
|
|
@variant-name: extract(@variant, 1);
|
|
@__variant-value: @variant;
|
|
.define-class(~"@{screen-name}\:@{utility}-@{variant-name}"; @ruleset);
|
|
}
|
|
|
|
.generate-screen-utility-variants(@utility; @variants; @screen-name; @ruleset; @i: 1) when (@i <= length(@variants)) and (length(extract(@variants, @i)) = 1) {
|
|
& {
|
|
.generate-screen-utility-variant(@utility; @variants; @screen-name; @ruleset);
|
|
}
|
|
}
|
|
|
|
.generate-screen-utility-variants(@utility; @variants; @screen-name; @ruleset; @i: 1) when (@i <= length(@variants)) and (length(extract(@variants, @i)) = 2) {
|
|
& {
|
|
@variant: extract(@variants, @i);
|
|
.generate-screen-utility-variant(@utility; @variant; @screen-name; @ruleset);
|
|
}
|
|
.generate-screen-utility-variants(@utility; @variants; @screen-name; @ruleset; @i + 1);
|
|
}
|
|
|
|
.generate-responsive-utility-variants(@utility; @variants; @screens; @ruleset; @i: 1) when (@i <= length(@screens)) {
|
|
@screen: extract(@screens, @i);
|
|
@screen-name: extract(@screen, 1);
|
|
@screen-width: extract(@screen, 2);
|
|
|
|
@media (min-width: @screen-width) {
|
|
.generate-screen-utility-variants(@utility; @variants; @screen-name; @ruleset);
|
|
}
|
|
.generate-responsive-utility-variants(@utility; @variants; @screens; @ruleset; @i + 1);
|
|
}
|