[pmwiki-users] Proposed Default Stylesheet (pmwiki.css)

[H. Fox]

On 2/16/06, Joachim Durchholz <jo at durchholz.org> wrote:
> H. Fox schrieb:
> > Feedback is enthusiastically welcomed.
>
> I have modified the stylesheet slightly and applied it to my site at
>    http://durchholz.org/jo/debian-install/Main/Debian
> Take a look and decide which of the changes you wish to incorporate into
> the stylesheet. Copy settings as you wish :-)
>
> Changes are:
>
> 1) Settings for "#wikileft a" were removed.

I think this was discussed when the skin was originally developed and
the end result was arrived upon by consensus.

> 2) Removed the 10pt fontsize settings for "textarea, pre, tt, code".
> Font sizes should be relative, so that people with poor vision can
> increase font size everywhere. (I know, relative font sizes come with
> their own sets of problems.)

This is a bug.  It was supposed to be only for "textarea", not the others.

Styling fixed-width fonts appears to be tricky business!

I've spent considerable time and (hopefully) arrived at something that
should fit the main requirements (looks good, but degrades
gracefully).

> 3) Also removed the bold font for "h1 code, h2 code, h3 code". Bold font
> there is simply inappropriate if the heading is part <code>, part
> normal. (See the "Get and run debootstrap" heading on my site.)

It was appropriate for the default monospaced font, but....

> 4) Added
>    code, pre {
>      color:#007f00;
>      background-color:#eeeeee;
>      font-family:Lucida Console,monospace;
>    }
> That Lucida Console font is just to make it easier to read on a Windows
> platform.

I think this may be a case where tuning for one platform affects
others negatively.  For example, from what I'm reading it turns out
that using "monospace" nearly always hurts at least some platform. 
(IIRC Safari in particular.)

Setting a font will potentially improve things significantly.  FWIW
here's what seems to work best so far:

    pre, code { font-size:0.9em; font-family:'Lucida Console','Courier
New',Courier; }
    pre { line-height:1.2em; }

The next release is forthcoming so it can be tested...

> I use @@...@@ and [@...@] to mark server responses and text to type.
> Colorcoding it makes it easier to select the right passages for
> copy&paste. (That's something I've been wanting on pmwiki.org for a long
> time. Just monospacing the text doesn't make it stand out well enough,
> at least not for me. I think this kind of outlining monospaced text is
> definitely appropriate for computer-related wikis;

It is.  Your site does a good job with fixed-width text.  Maybe that
should be a recipe when the default stylesheet is finalized...

If something like this were enabled on pmwiki.org there would need to
be a *bunch* of preformatted code fix-up.  :-)

> I'm unsure about the
> use of @@...@@ in other contexts, so I'm not sure whether this should go
> into the default skin. Since pmwiki.org is definitely computer-related,
> it may even make sense to use a different css for pmwiki.org and for the
> default skin...)

I think I know the answer to this, but I won't speak for Pm...

> I'm not sure what I should do - I could certainly optimize it for my
> machine, but I'm pretty sure it would look ugly on other browsers/OSes.

Pm has expressed that compatibility with seldom-used browsers/OSes is
a high priority.

> 6) The vertical margins/paddings in <ul> and/or <li> are broken. If you
> look at the side bar, you'll see that if there's a sequence of subitems,
> the item heading them has less empty space above it than below. That's
> just reverse of how it should be (if the empty space should be different
> at all - I'd prefer if line distances were all equal, but would tolerate
> slight differences).
> This problem seems to be inherited from the 2.0 PmWiki stylesheet.

Actually, they aren't "broken" unless you remove the styling for links
there (#1 above).  The visual effect that makes links /appear/ to have
more whitespace above them is the underline.  To prove this out, try
text-decoration:overline; on the links.

Originally I had extra padding above, but, at least for this release,
that has been forgone for the sake of making the skin easier to render
on browsers with under-developed CSS-handling capabilities.

> BTW I'm going to keep that stylesheet, unless and until you improve it
> further :-)
> It's already an improvement over the current default stylesheet (which,
> in turn, was an improvement over the 1.0 stylesheet). I particularly
> like the way it now handles font sizes and vertical margins for the
> headings.

Good!  That's a meaningful endorsement that the improvements are
indeed improvements.  :-)

Thanks, Jo.  That was helpful.

Hagan