Álvaro,
Thanks - I am now getting closer to a full understanding of this. In this
case I have the color value available in a variable or field value, I
wanted to find a way to pass the color to the button display
"programaticaly".
- It supports my suspicion that button css is not as hackable as you
would expect from tiddlywiki, making this a harder than average to
customise this aspect of the User Interface, while making use of the CSS to
define a button in the view toolbar (and elsewhere)
Ideally the tiddlywiki designer can just supply a hex or named color,
rather than a need to define a range of classes (colors).
Perhaps there is an argument that the tiddlywiki toolbar buttons css need
to be change to permit a programaticaly set color to be provided
(optionally).
Álvaro, can you think of a way to open this to user customisation? I think
it is important enough to consider some changes.
Regards
Tones
On Wednesday, 19 May 2021 at 03:25:50 UTC+10 Álvaro wrote:
> 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/9d547c46-988d-445d-8c9f-1f41f344e692n%40googlegroups.com.
