Множественные объявления box-shadow в Sass

Я хотел бы создать миксин Sass для свойства box-shadow, но у меня возникли некоторые проблемы. Некоторая часть существующего кода выглядит так:

#someDiv {
  -moz-box-shadow:0 0 5px rgba(0,0,0,.25);
}

#someOtherDiv {
  -moz-box-shadow:0 0 5px rgba(0,0,0,.25) inset;
}

#theLastDiv {
  -moz-box-shadow: 0 0 5px rgba(0,0,0,.25), 0 1px 0 rgba(255,255,255,.2) inset;
}

Попытка свести все это в один миксин становится проблематичной. Документация по использованию логики в миксинах довольно скудна.

Я хотел бы создать несколько миксинов, например:

@mixin boxShadow($xOffSet, $yOffSet, $blur, $red, $green, $blue, $opacity, $inset : false) {
  @if $inset == true {
    -moz-box-shadow: #{$xOffSet}px #{$yOffSet}px #{$blur}px rgba($red,$green,$blue) inset;
  } @else {
    -moz-box-shadow: #{$xOffSet}px #{$yOffSet}px #{$blur}px rgba($red,$green,$blue);
  }
}

Это вызывает ошибки, потому что я предполагаю, что Sass не может оценить переменную $ inset.

предыдущий пример только демонстрирует проблему, с которой я сталкиваюсь, когда дело доходит до вставки тени блока или нет. Другая проблема, с которой я сталкиваюсь, - это когда для одного элемента объявляется несколько теней блока. Для справки обратитесь к описанному выше #theLastDiv

@mixin boxShadow($declarations : 2, $xOffSet1, $yOffSet1, $blur1, $red1, $green1, $blue1, $opacity1 $xOffSet2, $yOffSet2, $blur2, $red2, $green2, $blue2, $opacity2) {
  @if $declarations == 1 {
    -moz-box-shadow: #{$xOffSet}px #{$yOffSet}px #{$blur}px rgba($red,$green,$blue);
  } @else if $declarations == 2 {
    -moz-box-shadow: #{$xOffSet1}px #{$yOffSet1}px #{$blur1}px rgba($red1,$green1,$blue1), #{$xOffSet2}px #{$yOffSet2}px #{$blur2}px rgba($red2,$green2,$blue2);
  }

Иногда элемент имеет одну тень блока, а в других случаях он должен разделять тени блока. Я ошибаюсь, что Sass не может расшифровать эту логику и что для этого потребуются отдельные миксины (один для элементов с одной тенью блока, другой для миксинов с двумя тенями блока).

И чтобы усложнить вопрос, как это сделать проблема непрозрачности, описанная выше, влияет на это? Хотел бы получить отзывы по этому поводу. Сообщите мне, если я ошибаюсь или мои взгляды на проблему в целом ошибочны. Спасибо!

20
задан Kevin Burke 24 September 2012 в 22:46
поделиться