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.