search

postcss / postcss-bem-linter

A BEM linter for postcss
MIT License
572 stars 35 forks source link

Invalid Component Selector #107

Closed hendrikeng closed 7 years ago

hendrikeng commented 7 years ago 
/** @define c-logo
  */

/** @define js-logo
  */

.js-logo--scrolled .c-logo__main {
  opacity: 0;
  transform: translateX(-32px);
}

.js-logo--scrolled .c-logo__transformed {
  opacity: 1;
  transform: translateX(0);
}

why is this throwing the "invalid component selector" error? is there a main reason?

i know that something like .c-block h2 would throw that error since its too location dependent but i have no clue how i would change the selector pattern to transform the logo into another one..thanks a lot guys

simonsmith commented 7 years ago

It's expecting the second selector to begin with js-logo as well. Have you tried weak mode? - https://github.com/postcss/postcss-bem-linter#conformance-tests

hendrikeng commented 7 years ago

@simonsmith ahh thanks a lot simon, i guess i should go for weak mode then, would be a bit of an overkill to add another class, since i only use js classes for js added stuff....thanks a lot :-)

hendrikeng commented 7 years ago

works perfekt and its great if i just declare it for the one specific case with 

/** @define js-logo; weak
  */