[tw] markup similar to <code> or <file> from otehr wikies

18 views
Skip to first unread message

realthor

unread,
Apr 22, 2010, 12:25:27 PM4/22/10
to TiddlyWiki
hello everybody,

i am new on the forums and also new with tidlywiki and have one
question: is it possible to have a formatting of code snippets or file
(copy/paste from files) like a dashed box around the code, see an
example here:
http://www.dokuwiki.org/syntax

thanks

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To post to this group, send email to tiddl...@googlegroups.com.
To unsubscribe from this group, send email to tiddlywiki+...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/tiddlywiki?hl=en.

Message has been deleted

Mike

unread,
Apr 22, 2010, 4:24:22 PM4/22/10
to TiddlyWiki
Have you tried
{{{my code here}}}

or

{{{
my code here
my code here
my code here
my code here
}}}

Mike

realthor

unread,
Apr 23, 2010, 1:42:59 AM4/23/10
to TiddlyWiki
That markup makes a solid line rectangle around the inclosed text with
the background colored in one of the colors defined in the
ColorPalette , can't remmember which one. I am sure it can be done
with some CSS but I am not familiar with CSS and nor I have any idea
where to modify and which element (from the source code of the wiki I
can see it's the <pre> tag that it is used just before any text I
enter inside {{{ }}} ).
If you didn't see on the previous link what I am talking about perhaps
it is more obvious here:http://www.howtoforge.com/
bastille_firewall_centos

PMario

unread,
Apr 23, 2010, 5:16:21 AM4/23/10
to TiddlyWiki
Hi,
Looking with firebug to your link. It is a
<p> .. paragraph element with class='command'

html at your example looks like
<p class='command'>
your text here
</p>

==== 1 ===============
using TW looks like

{{command{
your text here
}}}

Adding the following to the TW StyleSheet Tiddler

/*{{{*/
.command {
background-color : #F9F9F9;
border : 1px dashed #2F6FAB;
color : black;
font-family : "Courier New", Courier, mono;
font-size : 12px;
font-style : italic;
line-height : 1.1em;
padding : 1em;
margin : 0 0 0.8em;
}
/*}}}*/
==========================

======= 2 ================
As you mentioned allready TW uses the <pre> tag
CSS definitions found at

StyleSheetColors .. color definition
.viewer pre {
border:1px solid [[ColorPalette::SecondaryLight]];
background:[[ColorPalette::SecondaryPale]];
}


StyleSheetLayout .. padding, margin ..
.viewer pre {
padding:0.5em;
margin-left:0.5em;
font-size:1.2em;
line-height:1.4em;
overflow:auto;
}

and maybe some other places.

changing the above 2 to your needs, putting it to StyleSheet will
overwrite the default definition for
{{{
your text here
}}}
=======================

tested 1 .. works for me
didn't test 2

regards mario

PMario

unread,
Apr 23, 2010, 5:24:46 AM4/23/10
to TiddlyWiki
hi

On Apr 23, 7:42 am, realthor <florin.fu...@gmail.com> wrote:
> That markup makes a solid line rectangle around the inclosed text with
> the background colored in one of the colors defined in the
> ColorPalette , can't remmember which one. I am sure it can be done
> with some CSS but I am not familiar with CSS and nor I have any idea
> where to modify and which element (from the source code of the wiki I

http://www.w3schools.com/css/css_boxmodel.asp
http://www.w3schools.com/css/css_background.asp

2 pointers for more info :)

realthor

unread,
Apr 26, 2010, 3:36:45 AM4/26/10
to TiddlyWiki
Wow that was easy...I just copied:
.viewer pre {border:1px solid [[ColorPalette::SecondaryLight]];
background:[[ColorPalette::SecondaryPale]];}
to the StyleSheet tiddler and changed it to:
.viewer pre {border:1px dashed [[ColorPalette::SecondaryLight]];
background:[[ColorPalette::SecondaryPale]];}

It worked like a charm. Good thing to know that everything re-defined
in the StyleSheet tiddler overrides whatever definition elsewhere.
Reply all
Reply to author
Forward
0 new messages