question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Mixin Interpolation

See original GitHub issue

We have selector interpolation, yet mixin interpolation does not work

For example:

.device-type(@namespace:~'') {
    .@{namespace}-test { width:50%; }
}

.device-type(~"laptop-");

Would generate a css class laptop-test, that could be used here:

<div id="test" class="laptop-test"> .... </div>

However, if I add this, things fail:

#test {
    .laptop-test;
}

One would expect it to generate:

.laptop-test {
    width:50%;
}
.testdiv {
    width:50%;
}

Issue Analytics

  • State:closed
  • Created 11 years ago
  • Comments:13 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
matthew-deancommented, May 28, 2013

+1 to variable use in mixin definition and call

0reactions
seven-phases-maxcommented, Apr 13, 2015

is still not supported yet?

No. Neither in interpolated nor in simple variable form. (I re-opened #1338).

Read more comments on GitHub >

github_iconTop Results From Across the Web

Interpolation - Sass
Interpolation can be used almost anywhere in a Sass stylesheet to embed the result of a ... @mixin corner-icon($name, $top-or-bottom, $left-or-right) ...
Read more >
Sass Interpolation of Mixin, Function, and Variable names
Interpolation doesn't work on mixins or variables at this point in time. You'll have to come up with a different way to achieve...
Read more >
SASS: interpolation in a name of variable - Krasimir Tsonev
The idea is to use a variable and construct another thing. However it is currently not possible to use interpolation in names of...
Read more >
Features In-Depth | Less.js
Less extends CSS with dynamic behavior such as variables, mixins, operations and functions. Less runs on both the server-side (with Node.js and Rhino)...
Read more >
SASS | Interpolation - GeeksforGeeks
Interpolation allows us to interpolate sass expressions into a simple SASS or CSS ... @mixin interpolation($changeable, $val, $val2, $prop1, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found