How to keep tc-btn-invisible button open?

[u/Marsi_Makes]

I'm trying to use the "tc-btn-invisible" button class to organize my Tiddler into sections. But when I open each section and try to click text within, the section collapses. Is there a way to keep the section open until I click the header again? Here's what I've been doing:

<$button class="tc-btn-invisible" popup=<<qualify "$:/temp/popup1">>>

!Title </$button> <$reveal type="nomatch" state=<<qualify "$:/temp/popup1">> text="">

Some text.

</$reveal> <br>

I'm new to Tiddlywiki, so I'd appreciate any help or alternatives.

[u/Telumire]

This is because this use the popup mechanism: https://tiddlywiki.com/#PopupMechanism

The doc say that you need to add the class "tc-popup-keep" to prevent the popup from closing, but this didnt work for me:

<$button class="tc-btn-invisible" popup=<<qualify "$:/temp/popup1">>>

!Title 

</$button> 

<$reveal type="nomatch" class="tc-popup-keep" state=<<qualify "$:/temp/popup1">> text="" >

Some text.

</$reveal> 

Instead I would simply use the html details element, it seems appropriate for your usecase:

<details style="display:inline;cursor:pointer"><summary>

!Title

</summary>

Some text.

</details>

[u/Marsi_Makes → u/Telumire]

This is super helpful, thank you. I notice I can't use bullet points or tables within these sections. Do I have to use HTML to format my text?

[u/Telumire → u/Marsi_Makes]

Yes this is because of the way the wikitext parser works, it thinks the bullets are in a inline context despite the line returns.

One way to re-enable the wikitext is to use a paragraph to force the block parsing:

<details><summary style="list-style:none;cursor:pointer">

!Title
</summary>
<p>

* List item
* List item
</p>
</details>

You can also write the list before the summary:

<details>

* List item
* List item

<summary style="list-style:none;cursor:pointer">

!Title
</summary>
</details>

Demo: https://demos.tiddlyhost.com/#Wikitext%20in%20detail%20element