Hi Fred The easiest way to accomplish what you require is simply to edit the SVG image to remove the fill="xx" attributes entirely; the default fill colour will then be inherited, or can be set via CSS.
If you are interested in templating SVG images, there's an example I did here to make the text within an SVG image be translateable: https://manuals.annafreud.org/ambit/#%24%3A%2F_AMBITWheel%2FTemplate:Home%20%24%3A%2F_AMBITWheel%2FEnglish%20%24%3A%2F_AMBITWheel%2FStyles%20%24%3A%2F_AMBITWheel%2FMacros%20%24%3A%2F_AMBITWheel%2FTemplate If the link doesn't work, the tiddlers I'm pointing to are: * Home * $:/_AMBITWheel/English * $:/_AMBITWheel/Styles * $:/_AMBITWheel/Macros * $:/_AMBITWheel/Template Best wishes Jeremy. -- Jeremy Ruston [email protected] https://jermolene.com > On 13 May 2021, at 03:36, Frédéric Demers <[email protected]> wrote: > Hello everyone, > > probably an easy answer, but have been banging my head against this one for a > while... > > I imported an SVG icon > (https://morosanuae.github.io/tw-icons/#$:/images/icon-park/edit/list-checkbox-outline) > and am trying to simply change the stroke/fill colour to the generic > <<colour foreground>> so it is most flexible when changing palette... > > Here's what I have so far, only one value to change really, and haven't > managed to make it work; whenever I replace the string with the macro, the > icon vanishes; tried a second define and tried using an external $(var)$ > inside the macro definition instead, and tried all types of quotes in three > different places (main svg, around the variable and the macrocall parameter); > alas no joy... > > \define drawIcon(foreground) > <svg width="22pt" height="22pt" class="tc-image-button" viewBox="0 0 48 48" > fill=$foreground$><rect width="48" height="48" fill=$foreground$ > fill-opacity="0.01"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20 > 24H44H20Z" fill=$foreground$/><path d="M20 24H44" stroke=$foreground$ > stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path > fill-rule="evenodd" clip-rule="evenodd" d="M20 38H44H20Z" fill="none"/><path > d="M20 38H44" stroke=$foreground$ stroke-width="4" stroke-linecap="round" > stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20 > 10H44H20Z" fill="none"/><path d="M20 10H44" stroke=$foreground$ > stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" > y="34" width="8" height="8" fill="none" stroke=$foreground$ stroke-width="4" > stroke-linejoin="round"/><rect x="4" y="20" width="8" height="8" fill="none" > stroke=$foreground$ stroke-width="4" stroke-linejoin="round"/><rect x="4" > y="6" width="8" height="8" fill="none" stroke=$foreground$ stroke-width="4" > stroke-linejoin="round"/></svg> > \end > > <$vars icon_color="#c8ced8"> > <$macrocall $name="drawIcon" foreground="<<icon_color>>" /> > </$vars> > > thanks in advance!!! > -- > 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 [email protected]. > To view this discussion on the web visit > https://groups.google.com/d/msgid/tiddlywiki/dc54b674-9045-45ab-be25-c00359af0143n%40googlegroups.com. -- 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 [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/DAC37552-EE64-40C9-A221-B5E78A5A7643%40gmail.com.
