how do add a dot to a variable to be used as selector in less

Question

I'm currently getting this output:

.'teal-dark' { color: #xxx; }

What I want is this: {

.teal-dark { color; #xxx; }

Here is what I'm trying to do:

 @teal-dark: #xxx;
.@{currentMember} div { background: ~"@{@{currentMember}}" };

Answer 1

See: http://lesscss.org/features/#variables-feature-variable-interpolation http://lesscss.org/features/#variables-feature-variable-names and

@current-member: teal-dark;
@teal-dark: red;

.@{current-member} {
color: @@current-member;
}

compiles into:

.teal-dark {
  color: red;
}

Possible relevant questions:

• Defining Variable Variables using LESS CSS
• Dynamic class names in LESS

Answer 2

Here's the fix from another post:

    @selector: ~'.@{currentMember}';
    @{selector} div { background: ~"@{@{currentMember}}" };