SASS / SCSS @mixin с @ для того, чтобы не работать при использовании параметров

Я пытаюсь создать несколько селекторов CSS с помощью директив SASS @mixin и @for, например:

$colors: $comedy, $drama, $thriller, $scifi;
$color-names: comedy, drama, thriller, scifi;

@mixin taxonomy-color($property) {
  @for $i from 1 through length($color-names) {
    .#{nth($color-names, $i)}  {
      background-color: nth($colors, $i);
    }
  }
}

@include taxonomy-color(background-color);

Вышеупомянутое работает, но когда я меняю background-color: nth($colors, $i); на $property: nth($colors, $i);, CSS компилируется без ошибок, но я не получаю вывода от этого миксина. Может ли кто-нибудь сказать мне, почему моя логика ошибочна? Я использую SASS 3.3.0.rc.2.


variables css sass mixins
person kamontander    schedule 03.03.2014    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Просто вставьте _1 _...

@mixin taxonomy-color($property) {
  @for $i from 1 through length($color-names) {
    .#{nth($color-names, $i)}  {
      #{$property}: nth($colors, $i);
    }
  }
}

ДЕМО

person brbcoding    schedule 03.03.2014