I am writing this LESS file and I kind of stuck.
The code is as follows:
.flag (@code) {
(~'.@{code}') {
+ label {
&:after {
background-image: url('images/flags/@{code}.png');
}
}
}
}
input[type='radio'] {
&.flag {
.flag(us);
}
}
Right now, this produces the following CSS (note the space between .flag and .us)
input[type='radio'].flag .us + label:after {
background-image: url('images/flags/us.png');
}
However, the result that I am looking for should be as following:
input[type='radio'].flag.us + label:after {
background-image: url('images/flags/us.png');
}
Obviously I need the combinator (&) somewhere. But I can't seem to figure out where exactly. Everything I have tried so far results either in parsing errors or undesired results. Is it even possible to begin with?
Any help would be appreciated.