List of tags toggles : a question of style

Hello.

So, I wanted a way to add or remove tags from individual tiddlers without going into edit mode.
I wrote the following code, and it work as intended :

<div class="TagSelector-table">
<$list filter="[all[]tags[]!prefix[Offre]!is[system]sort[title]]" variable=tagName>
    <span class="TagSelector-item">
      <$button actions="""<$action-listops $tags="+[toggle<tagName>]"/>""">
        <$list filter="[{!!title}tag<tagName>]" emptyMessage="""{{$:/core/images/new-button}}""">{{$:/core/images/delete-button}}</$list>
      </$button> <<tagName>>
    </span>
</$list> 
</div>

There is just one things I would like to do if possible : style the tags names like the tag pills they are deriving from. Including the tag pill color.
I can’t find how to do this.
Using the tag names <<tag>> instead of the variable <<tagName>> don’t work, and I can’t find how to import this variable inside of the tag-pill macro.

Can you think of a way to style theses tagNames as their “original” tag pills ?
Or to directly insert the corresponding tag pills ?

Instead of

<<tagName>>

use this:

<$macrocall $name="tag-pill" tag=<<tagName>>/>

OR… if you want the tag pill to be clickable (to show the usual tag dropdown), use:

<$tiddler tiddler=<<tagName>>>{{||$:/core/ui/TagTemplate}}</$tiddler>

Notes:

  • The tag-pill macro is defined in $:/core/macros/tag

-e

1 Like

Thank you, it worked.
I hadn’t encountered this macro before, I need to note it somewhere.