The svg has two styles, one the inherited fron inline style in span and 
"direct rules" (*.tc-tiddler-controls button svg* ). When you apply direct 
rules the inherited rules are gone (they are overwritten by direct). You 
can see it in the inspector of your browser, "fill:red" is strikethrough.

You need add inline style in svg or add new class, for example in button.
button.icon-blue svg{fill:blue;}

and use it like
...
<$button message="tm-add-tag" param="$tag$" tooltip="Toggle $tag$"  
class="tc-btn-invisible icon-blue">
    <$transclude tiddler="$:/PSaT/check-tag/button/checked-icon" />
</$button>
...

Then you don't need wikify and you have a reusable style for the icon in 
buttons. You can change/add class dynamically to button like tiddlywiki 
does with varible and filter in *$:/core/ui/ViewTemplate/title*
El martes, 18 de mayo de 2021 a las 17:33:21 UTC+2, TW Tones escribió:

> Álvaro
> Thanks for you help
>
> So the fill in the css is forcing the button to  "fill: #cccccc;"
>
> The problem is I want to display it with a color provided to a macro and 
> use it instead. Meaning the button have multiple colors depending on the 
> value provided.
>
> This is the macro I want to display a colored button.
>
> \define check-tag-button(tag:"select" color:"blue" 
> display-filter:"[all[current]is[tiddler]]" )
> \whitespace trim
> <$list filter="$display-filter$" variable=display>
> <$wikify name=style text="""fill: $color$;""">
> <$fieldmangler>
>    <$list filter="[all[current]!tag[$tag$]]" variable=has-tag>
>         <$button message="tm-add-tag" param="$tag$" tooltip="Toggle 
> $tag$"  class="tc-btn-invisible">
>              <span style=<<style>> ><$transclude 
> tiddler="$:/PSaT/check-tag/button/unchecked-icon" /></span> 
>         </$button>
>   </$list>
>    <$list filter="[all[current]tag[$tag$]]" variable=not-tagged>
>         <$button  message="tm-remove-tag" param="$tag$" tooltip="Toggle 
> OFF $tag$"  class="tc-btn-invisible">
>            <span style=<<style>> ><$transclude 
> tiddler="$:/PSaT/check-tag/button/checked-icon" /></span>
>         </$button>
>   </$list>
> </$fieldmangler>
> </$wikify>
> </$list>
> \end
> <!--
> <$macrocall $name=check-tag-button  tag="" color="" display-filter=""/>
> <$macrocall $name=check-tag-button  tag="reference" color="red" 
> display-filter=""/>
> -->
>
> Thanks
> Tones
>
>
> On Wednesday, 19 May 2021 at 00:31:04 UTC+10 Álvaro wrote:
>
>> When you put a button (with the svg) in the viewtoolbar, it take style 
>> from here
>> *.tc-tiddler-controls button svg*, .tc-tiddler-controls button img, 
>> .tc-search button svg, .tc-search a svg {
>>     fill: #cccccc;
>> }
>>
>> You'll need add a class to the button
>>
>>
>> El martes, 18 de mayo de 2021 a las 14:36:44 UTC+2, TW Tones escribió:
>>
>>> Folks,
>>>
>>> I have 2 svg icons from https://morosanuae.github.io/tw-icons/
>>>
>>> I have created a button inside a macro and have used a number of methods 
>>> to get the colored  result in a tiddler, however when I add 
>>> the $:/tags/ViewToolbar to a tiddler to get it into the view tool bar the 
>>> color disappears.
>>>
>>> I want to use the same buttons again and again with only the tooltip, 
>>> actions and color changing. This save buttons and color coding is helpful.
>>>
>>> Can anyone tell me how to get past what ever styling is stopping the use 
>>> of the color?
>>>
>>> Thanks in advance for any hints.
>>> Tones
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/7a4981e3-f935-40fe-8b81-87ca870a2eb9n%40googlegroups.com.

Reply via email to