Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"&" includes all parent selectors #3356

Closed
dreamerblue opened this issue Jan 20, 2019 · 2 comments
Closed

"&" includes all parent selectors #3356

dreamerblue opened this issue Jan 20, 2019 · 2 comments

Comments

@dreamerblue
Copy link

dreamerblue commented Jan 20, 2019

Class name using "&" will include all parent selectors. Only current parent selector should be included.

It's so confusing. If it's an expected behavior, how to write less to output the expected css below?

Less Version: 3.9.0

Less

.wrapper {
  .prefix {
    &-a &-b {
      color: #333;
    }
  }
}

Output CSS

.wrapper .prefix-a .wrapper .prefix-b {
  color: #333;
}

Expected CSS

.wrapper .prefix-a .prefix-b {
  color: #333;
}
@dreamerblue dreamerblue changed the title "&" includes all parents selectors "&" includes all parent selectors Jan 20, 2019
@seven-phases-max
Copy link
Member

Only current parent selector should be included.

Something that is decided a decade ago and well documented can't be changed just because "it does not fit my particular use-case" (See #2395 (comment) for more details).

There're purposes like #1075 that are meant to meant to target a wider range of selector shuffling incl ..your use-case.

@seven-phases-max
Copy link
Member

Closing in favour of #1075 (and potentially #3053).

If it's an expected behavior, how to write less to output the expected css below?

Currently it's something like:

.wrapper {
    @-: ~'.prefix';
    @{-}-a @{-}-b {
        color: #333;
    }
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants