Thank very much for your reply, PMario. Your posting was very helpful, I really appreciate that you explained how to solve the problem. I was able to adjust the CSS to accommodate for both eventualities, this helps me to lower the learning curve for users of my wikis that have no CSS knowledge at all.
By the way, I'm of German descent, since my great great grandfather immigrated from Germany... ;-p Kind Regards Schalk Burger On Tuesday, April 18, 2017 at 11:35:29 AM UTC+2, PMario wrote: > > On Tuesday, April 18, 2017 at 2:05:15 AM UTC+2, Schalk Burger wrote: >> >> Thank you for the reply, but you did not offer anything new, that could >> hint towards an answer to my question(s). I have been referring that exact >> tiddler of the TiddlyWiki documentation within my posted questions. Look at >> the link hidden in the following: >> >> documentation >>> <http://www.google.com/url?q=http%3A%2F%2Ftiddlywiki.com%2Fstatic%2FLists%252520in%252520WikiText.html&sa=D&sntz=1&usg=AFQjCNGWOkk3dRpS9mms4DjC9F2agpWvfw> >> >> > I didn't follow the link. ... my bad! > > >> Also, I didn't think someone would just drop me the URL to the >> documentation, as if saying: "there go look it up" or "figure it out >> yourself". I was already referring to that URL in my questions, so to just >> drop me the URL, especially without any comment/ explanation or anything, >> was just a bit of a disappointment to be honest. >> > > You are right. I'm sorry. > > ------------ > > The point of the OP is, that the examples produce different HTML code. So > the CSS has to be different too. eg: > > @@.check > * one > * two > @@ > > produces: > > <ul class="check"> > <li>one</li> > <li>two</li> > </ul> > > which can be styled with CSS (just an example): > > .check li { > background: yellow; > } > > This mechanism is used, with Tobi Beers FontAwesome example page. ... but > IMO it uses a workflow, that is more complicated as it should be. ... As > you found out. Since what we want is the following: > > --------------- > > *.done one > * two > > produces: > > <ul> > <li class="done">one</li> > <li>two</li> > </ul> > > which can be styled with: > > li.done { > background: yellow; > } > > *Be aware, that I used ".done" *as the class indicator. So you can use > Tobias' TW for testing, without a styling conflict! > Styles used for the above HTML > > li.done{ > list-style-type:none; > padding:5px; > } > > li.done:before{ > content: "\f00c"; > color: #9bdd81; > > font: normal normal normal 24px/1 FontAwesome; > text-rendering: auto; > -webkit-font-smoothing: antialiased; > -moz-osx-font-smoothing: grayscale; > text-shadow: 1px 1px 1px rgba(150, 150, 150, 0.2); > > position:absolute; > display: inline-block; > margin: 0 0 0 -35px; > width: 30px; > font-size: 24px; > vertical-align: middle; > } > > I personally would try to make the stuff simpler with less dependencies. See > my German version. > http://tiddlywiki.com/languages/de-DE/#Task%20Management%20mit%20Listen:%5B%5BTask%20Management%20mit%20Listen%5D%5D%20%24%3A_TaskStylesheet%20%24%3A%2F_tags%2FListIcon > The concept is similar but has a simpler StyleSheet. ... Except creating the > data:uri css > <https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs>.. > > > I use MDN Mozilla Developers Network as my reference manual for HTML, CSS and > JS stuff. https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors > > have fun! > mario > > -- 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 https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/97fc91b5-69c4-42e2-9817-a057aa822197%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
