<details class="group details-marker-hidden"> <summary class="flex cursor-pointer"> <span class="mr-4">Trigger</span> <span class="hidden group-open::block">open</span> <span class="group-open::hidden">closed</span> </summary> <div> Content </div> </details>
.details-marker-hidden summary::-webkit-details-marker { display: none; }
Nice one, Jose. I used custom Stimulus JS for similar funcionality before. Always better to have native html solution 👏
Martin Sojka, Maker of CodeSnips
Does .group-open work with details? That's interesting.
.group-open
details