postcss
Nested multiple definitions
I was expecting this to work (maybe unreasonably?)
// style1.scss
.Style1 {
/** @define Foo */
.Foo {}
.Foo__a {}
.Foo__b {}
/** @end */
/** @define Bar */
.Bar {}
.Bar__a {}
.Bar__b {}
/** @end */
}
// style2.scss
.Style2 {
/** @define Foo */
.Foo {}
.Foo__a {}
.Foo__b {}
/** @end */
/** @define Bar */
.Bar {}
.Bar__a {}
.Bar__b {}
/** @end */
}
If, however, you have a good reason for multiple definitions within a single file, you can do that.
I think this is an OK reason? :) I assumed the definitions apply to what they wrap.
Essentially the components are namespaced, e.g
<div class="Foo">
<div class="Foo__a"></div>
<div class="Foo__b"></div>
</div>
...but the actual styles are only applied when a parent class is present:
<body class="Style1">
<div class="Foo">
<div class="Foo__a"></div>
<div class="Foo__b"></div>
</div>
</div>
Hi 👋 Can I get some feedback on whether this is worth me investing time on a PR? I don't want to start if it's not likely to get in. Cheers
Hey @amk221
I've not encountered this use case but I'd agree it would be nice for the linter to permit it. A PR would be very welcome and I'd be happy to consider it for merge
