SCSS Passing numeric value in Interpolation

Question

this is not working, Help needed, am I missing some thing??

I am trying to achieve Variable numeric value for @for $i ..... through .... {... , passing from mixin

$colors: ('primary': #000, 'secondary': #fff);

@mixin titleTxt($title, $start, $end) {
  @for $i from #{$start} through #{$end} {
    @if $i % 2==0 {
      .#{$title}-#{$i} {
        color: #000;

        @each $name,
        $color in $colors {
          &-#{$name} {
            color: #{$color};
          }
        }
      }
    }
  }
}

@include titleTxt("text", 16, 24)

score 0 · Accepted Answer · answered Apr 24 '23 at 07:16

The line @for $i from #{$start} through #{$end} is performing string interpolation for the start and end args, which cause the 'not a number' error.

Removin the #{...} string interpolation syntax and simply going with @for $i from $start through $end should solve your issue

SCSS Passing numeric value in Interpolation

1 Answers1