There is a way
But it is questionable how useful it would be, and also not very straightforward to achieve. However, for the sake of showing it can be done using the inline javascript feature of LESS, there is this example:
LESS
@className1: SomeCamelCased;
@className2: ALL-UPPER-CASE;
.Some-Class-Already-Defined {
prop: no straight forward way here;
}
.lowerCaseIt(@className) {
@newClass: e(`'@{className}'.toLowerCase()`);
&.@{newClass} {
prop: a passed class name will work;
.setProps();
}
}
& {
.lowerCaseIt(@className1);
.setProps() {
property: that you set
}
}
& {
.lowerCaseIt(@className2);
.setProps() {
property: that you set;
another: that you set;
}
}
& {
.lowerCaseIt(Some-Class-Already-Defined);
.setProps() {
p1: that you set;
p2: that you set;
}
}
CSS Output
.Some-Class-Already-Defined {
prop: no straight forward way here;
}
.somecamelcased {
prop: a passed class name will work;
property: that you set;
}
.all-upper-case {
prop: a passed class name will work;
property: that you set;
another: that you set;
}
.some-class-already-defined {
prop: a passed class name will work;
p1: that you set;
p2: that you set;
}
You can see that it requires some extra layering of mixins to set properties to this new class. As well, any already existing class must be passed in as a keyword value as the third example does, which means some "repetition" (you cannot just "read" the class name from LESS and have it spit out a lower case version).