Sass sem parenteses?

[anderluz 2]

Galera estou começando com Sass e estou com o seguinte problema, quero criar diversas classes com Sass em um laço de repetição assim:

$filters: blur brightness contrast grayscale saturate sepia;

@each $filter in $filters{
    .#{$filter}{
      -webkit-filter: $filter(100%);
      filter: $filter(100%);
      transition: all .5s ease-in-out; 
        &:hover{
           -webkit-filter:$filter(0);
            filter:$filter(0);
        }
    }
}

Porem o resultado saindo é este:

.blur {
  -webkit-filter: blur 100%;
  filter: blur 100%;
  transition: all .5s ease-in-out;
}
/* line 8, ../sass/img.scss */
.blur:hover {
  -webkit-filter: blur 0;
  filter: blur 0;
}

ou seja os números que deveriam ficar entre parenteses não ficam, como posso fazer para que apareçam?

[anderluz 2]

Acho que descobri ao iterar é necessário fazer a concatenação dessa forma:

filter: $filtro+"("+100%+")"; 

[anderluz 2]

$filters: blur brightness contrast grayscale saturate sepia;

 

@each $filter in $filters{

.#{$filter}{

-webkit-filter: $filter+"("+100%+")";

filter: $filter+"("+100%+")";

transition: all .5s ease-in-out;

&:hover{

-webkit-filter:$filter+"("+0+")";

filter:$filter+"("+0+")";

}

}

}