Is it possible to somehow make the selectors more flexible? By passing an array to selector, or so that the selectors don't attach to baseSelector? I've got a kind of complex set up where certain components always need the dark theme, while others always need the light theme (and then a page that the user can choose which theme they want), so the current functionality doesn't really work for me. I need something that could basically do the following:
dark theme applies tobody[data-theme="dark"]light theme applies tobody[data-theme="light"], body[data-theme="dark"] .some-light-component
button {
@apply light:bg-red dark:bg-blue;
}
<body data-theme="dark">
<div class="some-light-component">
<!-- button is red -->
<button></button>
</div>
</body>
<body data-theme="light">
<!-- button is red -->
<button></button>
</body>
<body data-theme="dark">
<!-- button is blue -->
<button></button>
</body>
Thanks in advance, and thanks for the great work on this project.
More of a question than an issue:
Is it possible to somehow make the selectors more flexible? By passing an array to
selector, or so that the selectors don't attach tobaseSelector? I've got a kind of complex set up where certain components always need the dark theme, while others always need the light theme (and then a page that the user can choose which theme they want), so the current functionality doesn't really work for me. I need something that could basically do the following:dark theme applies to
body[data-theme="dark"]light theme applies tobody[data-theme="light"], body[data-theme="dark"] .some-light-componentThanks in advance, and thanks for the great work on this project.