colore variabile Sass non funziona all'interno scurire()

Question

Ho elenco di colori e vorrei usare scurire() su di loro in questo modo:

$innerPagesBgColors: "#6B46C1", "#2980B9", "#FD5456", "#000"; 

.foo { 
    color: darken(nth($innerPagesBgColors, 3), 5%); 
} 

ma ottengo questo errore:

$color: "#FD5456" is not a color for `darken'

Ho provato a interpolare la parte ennesima() ma non è stato d'aiuto.

Answer 1

Il problema è che la funzione di oscuramento richiede un colore come primo argomento e, invece, si sta tentando di passare una stringa.

type-of(#6B46C1); // returns color 
type-of("#6B46C1"); // returns string 

Quindi è necessario rimuovere tutte le citazioni in $innerPagesBgColors:

$innerPagesBgColors: #6B46C1, #2980B9, #FD5456, #000; 

Answer 2

Nel mio caso ho risolto con questo.

@each $name, $color in $set_colors{ 
    // check type-of before 
    @if (type-of($color) == 'color'){ 
    .color-#{$name}{ 
     color: #{$color}; 
    } 

    .background-#{$name}{ 
     background-color: $color; 

     &:hover{ 
     background-color: darken($color, 10%); 
     } 
    } 
    } 
}