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

improve tailwind config to also catch dynamic classes #3143

Merged
merged 1 commit into from
Oct 25, 2024

Conversation

jheuel
Copy link
Contributor

@jheuel jheuel commented Oct 22, 2024

The previous tailwind config did not catch classes that are set dynamically, e.g.

use leptos::*;

fn main() {
    mount_to_body(|| {
        view! { <p
            class:text-orange-600=true
        >"This text should be orange"</p> }
    })
}

would not add text-orange-600.

The tailwind config now uses the content.transform property to transform the leptos code enough for tailwind to extract all classes. Furthermore, there is now a button in all tailwind examples with a dynamic class.

Fixes #2890

@jheuel jheuel force-pushed the improved_tailwind_config branch from e36d162 to a421cbd Compare October 24, 2024 08:26
@jheuel
Copy link
Contributor Author

jheuel commented Oct 24, 2024

Apologies, when I first opened the pull request I forgot to change the end2end tests. Should be fine now.

@gbj
Copy link
Collaborator

gbj commented Oct 25, 2024

Awesome! Thanks very much.

@gbj gbj merged commit 76facf9 into leptos-rs:main Oct 25, 2024
13 checks passed
@maxbergmark
Copy link

@jheuel I'm a bit late to the party, but thanks for fixing this issue that I opened a while ago!

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

Successfully merging this pull request may close these issues.

Conditional tailwind classes are not automatically included
3 participants