Sass @each интерполяция переменных

На моем новом сайте я пытаюсь сделать огромные усилия, чтобы использовать функции Sass, чтобы облегчить мою жизнь.

Я пишу несколько простых стилей ошибок и думал, что использование каждого из них упростит их немного.

У меня есть следующее:

• Слияние запросов СМИ, используя SASS и Breakpoint (Respond-To)
• Есть ли SASS.js? Что-то вроде LESS.js?
• Функция пропуска или смешение по ссылке в SASS
• Расширение селекторов из медиа-запросов с помощью Sass
• Как использовать SASS с NetBeans 8.0.1

$ message-box-types: ошибка успеха нормальная

@each $type in $message-box-types %#{$type}-box @extend %message-box border-color: $message-#{$type} color: $message-#{$type} background-color: lighten($message-#{$type}, 20%) 

Ошибки идентифицируют обе строки с помощью $ message – # {$ type}

У меня была аналогичная проблема с предыдущим заявлением @each, которое я пытался написать, но в итоге проигнорировал его и записал его на месте, поскольку я думал, что это не то, что Сасс не мог обработать.

У кого-нибудь есть идеи?

Нил

 $message-box-types: foo #ccc, bar #ddd @each $type, $color in $message-box-types %#{$type}-box @extend %message-box border-color: $color color: $color background-color: lighten($color, 20%)