1

I like using BEM for my css and I like to apply modifiers via the extend() function of LESS.

ex:

.btn{
  width: 100px;
  &--blue:extend(.btn){
    color: blue;
  }
}

1st question : Why can't I write it with the shortcut & like this ?

.btn{
  width: 100px;
  &--blue:extend(&){
    color: blue;
  }
}

2nd question : How can I call, in other less files, the generated classnames like :

.btn{
  width: 100px;
  &--blue:extend(.btn){
    color: blue;
  }
}

////

.myCustomButton{
  .btn--blue;
}

Thanks.

Xavier Haniquaut
  • 1,003
  • 9
  • 22
  • 2
    Have a look at [this thread](http://stackoverflow.com/questions/26559366/how-to-re-use-a-mixin-whose-selector-is-formed-using-concatenation?lq=1) for answer to the second part. Can't explain the *why* part of the first question, it is just how Less works. – Harry Aug 06 '15 at 10:02
  • 2
    As for "Why": "because it's not implemented". In general, `&` was never meant for a string-like words concatenation (e.g. the main purpose of `&` is to produce things like `a:b`, `a.b` etc, not things like `ab`)... So almost no Less feature has out-of-the box support for such string-like concatenated selector elements (and in many cases implementing such support is quite burdening). In other words, if it's about BEM-like selectors, then currently you have to either give up mixins/extend or such concatenating nesting (or BEM or Less themselves or so). Or adopt some not so evident trickery. – seven-phases-max Aug 06 '15 at 13:02
  • 2
    Also personally I always advertise against of reusing real CSS classes as mixins or with extend (since this creates additional but unnecessary and potentially flawed coupling/connections between your HTML and CSS), even if currently going [the other way around](https://gist.github.com/seven-phases-max/121ba3e353f416f9a4f3) requires polluting (in case of `extend`) your CSS with dummy/auxiliary selectors (not counting `(reference)` workarounds). – seven-phases-max Aug 06 '15 at 13:23
  • Thanks for your insightful answers! – Xavier Haniquaut Aug 06 '15 at 14:20
  • @seven-phases-max: Fair point. In that case, would you like to formulate your comments as an answer to the second point (and maybe link the other one inside your answer itself for the first part)? You are a much more authoritative source than me to comment on the second question and it does seem like a query that people could have in the future also :) (Removed previous comment because though it is about this question, it is a bit off-topic). – Harry Aug 07 '15 at 06:32

0 Answers0