[pmwiki-users] Comments in page

Tegan Dowling tmdowling at gmail.com
Wed Aug 30 08:32:47 CDT 2006


On 8/30/06, Hans <design5 at softflow.co.uk> wrote:
> Wednesday, August 30, 2006, 1:55:21 PM, The wrote:
>
> > As for the others, where is the css for
> > http://www.pmwiki.org/wiki/Test/Note.  That was quite cool.
>
> http://www.pmwiki.org/pmwiki/pub/note/note.css

There was more to the story, though.  Dom Faure pointed out a serious
compatibility issue AND provided two solutions, one of which it seems
anyone using this should employ.  Looks like this ought to be in a
recipe, huh?  See below:

On 2006-06-08, Dominique Faure <dominique.faure <at> gmail.com> wrote:
>On 6/7/06, Patrick R. Michaud <pmichaud <at> pobox.com> wrote:
> > The five files needed (one .css and four .png's) are at
> >
> >     http://www.pmichaud.com/pmwiki/pub/note/
> >
> > To use them, create a pub/note/ subdirectory, place the
> > files in that directory, and then add the following line
> > to a local customization file (e.g., local/config.php):
> >
> > $HTMLHeaderFmt['note'] =
> >   "<link rel='stylesheet' type='text/css' href='\$PubDirUrl/note/note.css />";
> >
> > This enables the >>classic<<, >>important<<, >>warning<<, and >>tip<<
> > styles.
> >
>
> The sample provided above is using png images which don't render well
> in IE. In order to retrieve the same aspect, they should be converted
> to gif (and have the transparency info reduced to a single color), or
> use the following lines into the local customization file:
> ===8<---
> $HTMLStylesFmt['note'] = <<<__EOT__
> .classic, .important, .warning, .tip {
>   margin: 2em;
>   width: 70%;
>   min-height: 40px;
>   padding: 15px 20px 15px 80px;
>   background-repeat: no-repeat;
>   background-position: 20px;
>   -moz-border-radius: 20px;
>   -khtml-border-radius: 20px;
>   border-radius: 20px;
> }
> .classic {
>   background-color: #eeeeff;
>   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='crop',
> src='$PubDirUrl/note/note.png');
> }
> .classic[class] {
>   background-image: url(note.png);
> }
> .important {
>   background-color: #ffffcc;
>   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='crop',
> src='$PubDirUrl/note/important.png');
> }
> .important[class] {
>   background-image: url(important.png);
> }
> .warning {
>   background-color: #ffdddd;
>   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='crop',
> src='$PubDirUrl/note/warning.png');
> }
> .warning[class] {
>   background-image: url(warning.png);
> }
> .tip {
>   background-color: #ddffdd;
>   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='crop',
> src='$PubDirUrl/note/tip.png');
> }
> .tip[class] {
>   background-image: url(tip.png);
> }
> __EOT__;
> ===8<---
>
> Regards,
> Dom




More information about the pmwiki-users mailing list