[tw] Re: Help converting a couple of tiddlers from TWC to TW5
Thanks for the help.
Eric's first idea (@@.loco26 nbsp;C.loco18 APON@@) worked right off.
I worked on the ::first-letter solution for a couple of hours and couldn't
get it to work. I'll come back to that because I think it's a more elegant
solution.
--Andy
On Sunday, May 17, 2015 at 10:27:20 AM UTC-4, Andy Arnold wrote:
Good Morning,
I've spent 40+ years writing code and converting files databases. This
problem should be easy, but it has me stumped.
I have a TWC tiddler (StyleSheetCustom) that defines some new css style
names. The new css defines fore/background color combinations as single
words. It also combines several font family terms into a single term
(loco26). Here's a few lines...
.backYellow{color: #000; background:yellow;}
.backGainsboro{color: #000; background: #DCDCDC;}
.backYellow30{color: #8B3A3A; background: yellow; font-size:30px;}
and I have another tiddler (Motive Power Paint) that uses the new css...
* {{backYellow30{{{loco26{nbsp;C}}}{{loco18{APON
}}}{{loco26{V}}}{{loco18{ALLEY}}}{{loco26{ R}}}{{loco18{AILROADnbsp;}}} }}}
The idea is to show 'CAPON VALLEY RAILROAD' in a common type face and a
common fore/background color pair with the C V R in a larger font-size than
the rest of the phrase.
I only want to do this for a few tiddlers; so I'm not looking for a
theme-level solution.
Can someone please send me to some links, etc. that have example
solutions?
Thanks
--Andy
--
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.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/739c4845-f330-4bb2-8158-092ed394d78e%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
[tw] Re: Help converting a couple of tiddlers from TWC to TW5
On Sunday, May 17, 2015 at 7:27:20 AM UTC-7, Andy Arnold wrote:
I've spent 40+ years writing code and converting files databases. This
problem should be easy, but it has me stumped.
I have a TWC tiddler (StyleSheetCustom) that defines some new css style
names. The new css defines fore/background color combinations as single
words. It also combines several font family terms into a single term
(loco26). Here's a few lines...
.backYellow{color: #000; background:yellow;}
.backGainsboro{color: #000; background: #DCDCDC;}
.backYellow30{color: #8B3A3A; background: yellow; font-size:30px;}
and I have another tiddler (Motive Power Paint) that uses the new css...
* {{backYellow30{{{loco26{nbsp;C}}}{{loco18{APON
}}}{{loco26{V}}}{{loco18{ALLEY}}}{{loco26{ R}}}{{loco18{AILROADnbsp;}}} }}}
The idea is to show 'CAPON VALLEY RAILROAD' in a common type face and a
common fore/background color pair with the C V R in a larger font-size than
the rest of the phrase.
I only want to do this for a few tiddlers; so I'm not looking for a
theme-level solution.
Can someone please send me to some links, etc. that have example
solutions?
Your stylesheet definitions are OK as-is. Just paste them into a new
tiddler in your TW5 document, and add the tag $:/tags/Stylesheet so that
the core will recognize it as CSS definitions.
However, the syntax for *using* the CSS classnames in inline content has
changed from TWC to TW5.
The TWC classwrapper syntax is:
{{classname{...content...}}}
The TW5 classwrapper syntax is:
@@.classname content@@
(note: the dot (.) before the classname and the space separating the
classname from the content are important!)
For your particular use-case, it's just a tiny bit trickier because you are
*nesting* the classes, and in inline mode, the @@ syntax doesn't nest.
However, you can easily work around this by using HTML for the outer
wrapper, like this:
span class=backYellow30
@@.loco26 nbsp;C.loco18 APON@@
@@.loco26 V.loco18 ALLEY@@
@@.loco26 R.loco18 AILROADnbsp;@@
/span
Note also that, for this particular use case, you can use the
::first-letter pseudo-element in your CSS definitions to achieve the same
results (first letter of each word in a larger font)
.loco2618
{ font-size:18pt; }
.loco2618::first-letter
{ display:inline-block;font-size:26pt; }
Then, you can use it like this:
span class=backYellow30
@@.loco2618 nbsp;CAPON@@
@@.loco2618 VALLEY@@
@@.loco2618 RAILROADnbsp;@@
/span
enjoy,
-e
Eric Shulman
ELS Design Studios
TiddlyTools - Small Tools for Big Ideas!
InsideTiddlyWiki: The Missing Manuals
YOUR DONATIONS ARE VERY IMPORTANT!
HELP ME TO HELP YOU - MAKE A CONTRIBUTION TO MY TIP JAR...
http://TiddlyTools.github.com/fundraising.html#MakeADonation
Professional TiddlyWiki Consulting Services...
Analysis, Design, and Custom Solutions:
http://www.TiddlyTools.com/#Contact
--
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.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/b04196aa-aa36-49cd-9e15-8c14b8e1a645%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
[tw] Re: Help converting a couple of tiddlers from TWC to TW5
HI Andy,
On Sunday, May 17, 2015 at 4:27:20 PM UTC+2, Andy Arnold wrote:
Good Morning,
I've spent 40+ years writing code and converting files databases. This
problem should be easy, but it has me stumped.
Nice to see, that an old stager likes TW ;)
The idea is to show 'CAPON VALLEY RAILROAD' in a common type face and a
common fore/background color pair with the C V R in a larger font-size than
the rest of the phrase.
In TW I'd use the following mechanism, which imo is much easier to read.
Define a CSS stylesheet tiddler eg: myStyleSheet tag it $:/tags/Stylesheet
.zz em {
display:inline-block;
font-style: normal;
}
.zz em:first-letter{
color: red;
font-size: 130%;
}
Your text
@@.zz
* //CAPON// VALLEY //RAILROAD//
** CAPON //VALLEY// RAILROAD
@@
or
*.zz //CAPON// VALLEY //RAILROAD//
As you see. I'm missusing the italics format here. ... you could also use
eg: strikethrough, where the CSS would look like this
.zz strike{
display:inline-block;
text-decoration:none;
}
.zz strike:first-letter{
color: red;
font-size: 130%;
}
and the text:
@@.zz
* ~~CAPON~~ VALLEY ~~RAILROAD~~
@@
With this CSS you get a similar result to Erics suggestion
.xx{
display:inline-block;
font-style: normal;
}
.xx:first-letter {
color: red;
font-size: 130%;
}
@@.xx Some.xx text@@ ... but I think it's hard to read
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 http://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/7afd21de-bf6d-44ab-a604-5712c5ec12d6%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
