796 B
796 B
| title | date | tags | note | permalink | |||
|---|---|---|---|---|---|---|---|
| Using data attributes with Tailwind CSS | 2024-08-27 23:39:23 |
|
true | /notes/18-using-data-attributes-with-tailwind-css |
Adam Wathan mentioned this in his "Tailwind CSS: It looks awful, and it works" at Rails World 2023.
This is the link to the video: https://www.youtube.com/watch?v=TNXM4bqGqek.
The data attribute example starts at 21:00, which shows using arbitrary classes for data attributes.
Examples
With the attribute on the same element:
<button class="data-[loading]:text-transparent" data-loading>
With the attribute on a parent element (group):
<button class="group data-[loading]:text-transparent" data-loading>
<span class="hidden group-data-[loading]:flex">...</span>
</button>