Data-Attributes Magic with Tailwind CSS & Stimulus

This article was originally published on Rails Designer

Changing the way some, or all, UI elements on an user interaction (click, hover, etc.) is really common. So you better have a good process to use this common flow.

There are basically three ways to go about this:

1. add the CSS class(es) to every element that needs changing;


2. add CSS classes to the parent element (eg. <span class="nav-opened">) to enable cascading of additional styles from it to child elements;


3. add a …

article class click css data designer etc every flow good magic process rails stimulus tailwindcss the way