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 tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at http://groups.google.com/group/tiddlywiki. For more options, visit https://groups.google.com/d/optout.