Dynamically class in mixin - less

Question

I have the following definition:
.f-color {
.a {color: #000000;}
.b {color: #ffffff;}
}
.f-type {
._36 {
font-family: Arial;
font-size: 36px;
}
._24 {
font-family: Arial;
font-size: 24px;
}
}
I want to create mixin that will look like this:
.a_36 {
color: #000000;
font-family: #font-omnes-light;
font-size: 36px;
}
I tried the following function:
.buildForColor(a);
.buildForColor(b);
.buildForColor(#c){
.#{c}_36 {
.f-color > .#{c};
.f-type > ._36;
}
}
But I'm getting an error with the line: .f-color > .#{c};
How can I pass the letter "a" so it will look like: .f-color > .a;
Thanks in advance

Answer 1

I found other way to define it:
In variables.less I defined:
#main_color_a: #000000;
#main_color_b: #ffffff;
Then in the mixin.less I defined:
.f-type {
._36 {
font-family: Arial;
font-size: 36px;
}
._24 {
font-family: Arial;
font-size: 24px;
}
}
.buildForColor(a);
.buildForColor(b);
.buildForColor(#c){
.#{c}_36 {
color: ~"#{main_color_#{c}}";
.f-type > ._36;
}
}
The compiled css looks like this:
.a_36 {
color: #000000;
font-family: Arial;
font-size: 36px;
}
.b_36 {
color: #ffffff;
font-family: Arial;
font-size: 36px;
}