I'm also interested in beeing able to use the color field value as a filter
for lists - even sort by color value :-) if anyone knows how to do it....
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.
