How to Use Scss Loops in Blazor dotnet Core 3.1.3
Great time saving technique of making loops in SASS/SCSS to be compliant with CSP (Content Security Policy) for protecting against unsafe inline/unsafe eval. How to Quickly loop through an make tons of css classes with scss in under 20 lines of code. hope you enjoy! Here's the code for the loop I used in the video
$max-pixel: 10;
@mixin make-min-max-classes {
@for $i from 1 through $max-pixel {
$ii: $i * 100;
.app-min-h-#{$ii} {
min-height: #{$ii}px;
}
.app-max-h-#{$ii} {
max-height: #{$ii}px;
}
.app-min-w-#{$ii} {
min-width: #{$ii}px;
}
.app-max-w-#{$ii} {
max-width: #{$ii}px;
}
}
}
@include make-min-max-classes;
