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

Applying classes on Lit element CSS block #510

Open
kadoshms opened this issue May 26, 2024 · 1 comment
Open

Applying classes on Lit element CSS block #510

kadoshms opened this issue May 26, 2024 · 1 comment

Comments

@kadoshms
Copy link

Hey!

I wonder if it's possible to use Twind classes within Lit elements styles block, some sort of the @apply decorator from Tailwind:

  static styles = css`
    :host button {
        @apply bg-blue-400;  
    }
  `;

That could be useful in cases I want to apply classes that are not necessary derived from reactive properties.
I wonder if it is possible, or even reasonable.

@sorvell
Copy link

sorvell commented May 29, 2024

Just hacking around a bit, I was able to add host styles, but had to introduce a helper method. It wasn't clear how to process css from the twind API. Here's an example using a hostRules(this.tw, ...rules) helper:

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