Sass biến màu không làm việc bên trong tối()

Question

Tôi đã có danh sách các màu sắc và tôi muốn sử dụng tối() trên họ như vậy:

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

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

Nhưng tôi nhận được lỗi này:

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

Tôi đã cố gắng nội suy phần thứ n() nhưng điều đó cũng không giúp ích gì.

Answer 1

Vấn đề là hàm tối sẽ yêu cầu màu làm đối số đầu tiên và, thay vào đó, bạn đang cố chuyển một chuỗi.

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

Vì vậy, bạn nên loại bỏ tất cả dấu ngoặc kép trong $innerPagesBgColors:

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

Answer 2

Trong trường hợp của tôi, tôi giải quyết vấn đề này.

@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%); 
     } 
    } 
    } 
}