Come posso passare un'espressione in un mixin calc() che utilizza variabili Sass

Question

Ho un mixin impostato per fare un calc cross browser,

@mixin calc($property, $expression...) { 
    #{$property}: -moz-calc(#{$expression}); 
    #{$property}: -o-calc(#{$expression}); 
    #{$property}: -webkit-calc(#{$expression}); 
    #{$property}: calc(#{$expression}); 
} 

Ho anche una variabile.

$line: 12px; 

Desidero poter utilizzare una variabile al suo interno.

@include calc(width, "30% - ($line * 2)) "); 

Ma non sono sicuro che sia il modo migliore per farlo.

Answer 1

Avrete bisogno di usare stringa di interpolazione sul valore si sta passando alla mixin:

.foo { 
    @include calc(width, #{"30% - #{$line * 2}"}); 
} 

uscita:

.foo { 
    width: -moz-calc(30% - 24px); 
    width: -o-calc(30% - 24px); 
    width: -webkit-calc(30% - 24px); 
    width: calc(30% - 24px); 
}