Hi Dave,
You should read Jeremy's post in this recent
thread: https://groups.google.com/d/msg/tiddlywiki/L1k9nEnOSwU/gnzEdDMZsy8J
It seems like we will be able to do much more - each tag will add a css
class to each tiddler. Very cool.
Regards,
Richard
On Friday, August 8, 2014 10:46:20 AM UTC+10, David Gifford wrote:
>
> This is like months old, and no one responded to you, but I would love to
> see this too. Imagine a travel TW where restaurant links for one city are
> one color, attractions are another color, etc.
>
> Dave
>
> On Tuesday, April 22, 2014 4:28:47 AM UTC-5, Måns wrote:
>>
>> If it's possible to use the color field value for css > then it should be
>> possible to create a class for colored links?
>>
>> I like the idea of being able to use existing field values for different
>> things -
>>
>> Den tirsdag den 22. april 2014 10.19.30 UTC+2 skrev Måns:
>>>
>>> Hi TwWizards
>>>
>>> I'm trying to make use of the tag color field value in other contexts
>>> where it would be usefull for me.
>>>
>>> Example:
>>>
>>> I want to show a list of css formatted "mini-tiddlers" all tagged with
>>> task. Each task has a color (field) value which categorizes it in groups as
>>> a small task(yellow), medium task(blue) or big task(red).
>>>
>>> Now I want the css background color style for the "mini-tiddlers" to
>>> reflect these colors...
>>>
>>> I guess this might be done either by overriding the background color of
>>> the parent css class or by creating a new modified parent css class which
>>> fetches the color field value from each tiddler in the list...
>>>
>>>
>>> This is my list (where I try to override the background-color of the
>>> parent css class (tw-link-info-item):
>>>
>>> <$list filter="[tag[task]] -[[task]] +[!sort[modified]limit[300]]">
>>>
>>> <div class="tw-link-info-item" style="background-color:{{!!color}};">
>>>
>>> ! <$link><$view field="title"/></$link>
>>>
>>> <div class="tw-subtitle">Updated <$view field="modified"
>>> format="relativedate"/></div>
>>>
>>> |borderless small widetable|k
>>> | Task<$button message="tw-modal" param={{!!title}} class="btn
>>> btn-inverse"> preview </$button> |h
>>> | <$list filter="[is[current]tagging[]sort[title]]"><br> <$link
>>> to={{!!title}}><a href={{!!imageurl}} target="_blank"><img
>>> src={{!!imageurl}} width="32" class="tw-image"
>>> title={{!!title}}/></a></$link> <br>{{!!title||$:/core/ui/TagTemplate}}<br></$list><br>
>>>
>>> |
>>> | Start: <$edit-text field="start" tag="input" type="date"
>>> format="YYYY-MM-DD"> </$edit-text> |
>>> | End: <$edit-text field="end" tag="input" type="date"
>>> format="YYYY-MM-DD"> </$edit-text> |
>>>
>>>
>>> </div>
>>>
>>> </$list>
>>>
>>> The "mini-tiddler" class I borrowed from Jeremy's Community tab tiddler
>>> sources :
>>>
>>> { .tw-link-info { -moz-column-count: 2; -moz-column-gap: 10px;
>>> -webkit-column-count: 2; -webkit-column-gap: 10px; column-count: 2;
>>> column-gap: 10px; } .tw-link-info-item { width: 100%; } }
>>> .tw-link-info-item { display: inline-block; border: 1px solid #bbb;
>>> padding: 5px 10px; margin-bottom: 10px; background: #fcf8f8; font-size:
>>> 0.8em; line-height: 1.2; } .tw-link-info-item h1 { font-weight: 500;
>>> font-size: 16px; } .tw-scrollable-demo { border: 1px solid #cfd6e6;
>>> background-color: #ecf2ff; padding: 1em; height: 400px; }
>>>
>>> I wonder if I could make it be responsive to a color field value ?? :
>>>
>>> { .tw-link-info { -moz-column-count: 2; -moz-column-gap: 10px;
>>> -webkit-column-count: 2; -webkit-column-gap: 10px; column-count: 2;
>>> column-gap: 10px; } .tw-link-info-item { width: 100%; } }
>>> .tw-link-info-item { display: inline-block; border: 1px solid #bbb;
>>> padding: 5px 10px; margin-bottom: 10px; background: {{!!color}}; font-size:
>>> 0.8em; line-height: 1.2; } .tw-link-info-item h1 { font-weight: 500;
>>> font-size: 16px; } .tw-scrollable-demo { border: 1px solid #cfd6e6;
>>> background-color: #ecf2ff; padding: 1em; height: 400px; }
>>>
>>>
>>> Cheers Måns Mårtensson
>>>
>>> [**] Work in progress: http://opgavefordeling.tiddlyspot.com/ css
>>> class is in the tiddler infoCSS ..
>>>
>>>
--
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 post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/d/optout.
