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

Add apply-parent-classes feature to class-tools #2485

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

schungx
Copy link

@schungx schungx commented Apr 16, 2024

This PR adds a very useful feature.

It reads any apply-parent-classes or data-apply-parent-classes nodes, and then applies the class changes to its parent. The nodes are removed afterwards and not left in the target; therefore they are transitional and only act as containers to the class modification commands.

This can be used to surgically add/remove classes in any DOM element via OOB updates..

For example, the following will add the foo class to #my-element after 1 second, then remove the foo class one second later, vanishing without a trace afterwards. The net effect is direct OOB control by the server of client-side CSS classes.

<div hx-swap-oob="beforeend: #my-element">
    <div apply-parent-classes="add foo:1s, remove bar:1s></div>
</div>

This is a way to non-intrusively affect the CSS classes of an element without knowing its content.

@schungx schungx changed the title Add apply-parent-classes feature Add apply-parent-classes feature to class-tools Apr 16, 2024
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.

None yet

1 participant