Sass interpolation

1

Hi all.
I did the Sass tasks here in freecodecamp.
And I noticed I get a warning in dos, when watching the sass file,
I always copy the assigments from here in a notepad++ file to have it .
this is the code

@each $color in blue, red, green {
  .#{$color}-text {color: $color;}         //this line is complained about 
}

$mapcolors: (color1: blue, color2: red, color3: green);

@each $color, $mapcolor in $mapcolors {
  .#{$mapcolor}-text {color: $mapcolor;}      //this line is complained about 
}

@each $key, $color in $mapcolors{
   .#{$color}-bg {background-color:$color;}   //this line is complained about 
}

this is the warning:

"you probably dont mean to use the color value “red” in interpolation here
it may end up represented as #ff0000 , which will likely produce invalid css
always quote color names when using them as strings (for example “red”)
if you really want to use the color value here, use "" + $color. "

it the same for each color.
so I’m unsure what this means as this code is very similar to what was correct , i do change it a bit to experiment.

I did read a bit online about sass interpolation , so it’s the #{} part that is considered wrong in certain context or such ?

Thanks for any help :slight_smile: