Using less variable inside microsoft gradient

Question

I'm having some trouble getting .LESS to recognize that there is a variable in a string. Here is my current code

filter: progid:DXImageTransform.microsoft.gradient(startColorstr='@{startColor}', endColorstr='@{endColor}', GradientType=0);

@startColor and @endColor are both variables.

How can I place a .LESS variable inside a string?

EDIT:

I fixed it (I think..) Here is the end code that works for me

filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr=@startColor, endColorstr=@endColor, GradientType=0);

Answer 1

Try:

filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr='@{startColor}', endColorstr='@{endColor}', GradientType=0)"

The tilda and quotes allow you actually escape code for just this situation. I also end up using for my opacity stuff but that is because I want to reusing the word opacity as the function name.

filter: ~"alpha(opacity=@{op})! important" 

Answer 2

It´s best to escape the entire filter property using: ~"filter" and wrapping the less variable (without the "@" symbol) in curly brackets.

I´ve created a mixins that properly transform a color and opacity values into a rgba and an argb values respectively:

.rgba(@color, @opacity) {
    @rgba: fade(@color, @opacity);
    @ieColor: argb(@rgba);

    background-color: @rgba;
    filter: ~"progid:DXImageTransform.Microsoft.gradient( startColorstr='@{ieColor}', endColorstr='@{ieColor}',GradientType=0)";
}