Проверьте переменную в Sass mixin и распечатайте ее, если она определена

Question

Я создаю микшер Sass с тремя аргументами, один из которых является необязательным & Я хочу распечатать его, если он передан иначе Я не хочу ничего печатать ,

Вот как мой Mixin выглядит следующим образом:

@mixin name($arg1, $arg2, $arg3: false){ 
    @if $arg3 { #{$arg3} , } 
    & { 
     color: #{$arg1}; 
     > #{$arg2}{ 
      &:before{ 
       something... 
      } 
     } 
    } 
} 

, но это не работает & он выдает ошибку

Warning: Syntax error: Invalid CSS after "...$arg3}": expected "{", was "}"

Так как я могу достичь желаемого результата?

Answer 1

Это было бы, как можно было бы написать это:

@mixin name($arg1, $arg2, $arg3: false) { 
    $sel:(); 
    @if $arg3 { 
     $sel: append($sel, unquote($arg3)); 
    } 
    $sel: append($sel, unquote('&'), comma); 
    #{$sel} { 
     color: #{$arg1}; 
     > #{$arg2} { 
      &:before{ 
       border: 1px solid; 
      } 
     } 
    } 
} 

.foo { 
    @include name(yellow, blue, '.bar'); 
} 

Выход:

.foo .bar, .foo { 
    color: yellow; 
} 

.foo .bar > blue:before, .foo > blue:before { 
    border: 1px solid; 
} 

Однако, это может быть лучше написано так:

@mixin name($arg1, $arg2) { 
    color: #{$arg1}; 
    > #{$arg2} { 
     &:before{ 
      border: 1px solid; 
     } 
    } 
} 

%foo, .foo { 
    @include name(yellow, blue); 
} 

.foo .bar { 
    @extend %foo; 
}