[Fwd: Pelt skin details]

[Maurice Lanselle <la...@evc.net>]

Hello,

I found an answer to one of my own questions.

Q: The little detail the annoys me concerns the rounded corners on the 
menu.  When I changed the "body" color I discovered that "body" in this 
skin is not what the content is written on, but what appears below the 
footer (when the page is short) and beneath the menu (in the "layers" 
sense).  So when I changed this color to not white, the "pointy" parts 
of the menu bottom corners showed up.

A: The bottom-left corner is set in site2xhtml.xsl:
        <div id="roundbottom">
            <img 
                src="{$skin-img-dir}/rc-b-l-15-1body-2menu-3menu.png" 
                alt="" width="15" height="15" class="corner" 
                style="display: none" />
        </div>

Changing the src to "{$skin-img-dir}/rc-b-l-15-1content-2menu-3menu.png" makes its point disappear, too.


It works!  But I'm even more confused now. It has "display: none" and it 
is in a div with id=roundbottom, so why is the hidden image displayed 
instead of the roundbottom(rc-b-r- ) background-image?  Off-topic, skip 
it...I'll work it out.


Regards,
Maurice



a) I found in the screen.css

#roundbottom {
background-image: url(images/rc-b-r-15-1body-2menu-3menu.png);
background-repeat: no-repeat;
background-position: top right;
}
Adding an entry in skinconf for
<color name="content" value="#FFFFFF" />
("content" is not a color name in the standard list, BTW, in neither the
skinconf.xml for a project nor the skinconf.xsl for pelt, but I find it
useful in this case)
and changing the roundbottom style to

#roundbottom {
background-image: url(images/rc-b-r-15-1content-2menu-3menu.png);
background-repeat: no-repeat;
background-position: top right;
}

worked, but only for the bottom right corner (rc-b-r appears to mean
roundcorner-bottom-right). I cannot find the equivalent for the bottom
left corner anywhere! And its point is still colored...can someone
please tell me how to fix this corner, too?

 

Re: [Fwd: Pelt skin details]

[Maurice Lanselle <la...@evc.net>]

Thorsten Scherler said the following on 09/06/2005 19:44:

>http://forrest.apache.org/0.7/docs/howto/howto-corner-images.html
>
>HTH
>
>  
>
Yes, this is a well-written howto.  As its example demonstrates,  It 
could benefit from the two things I learned (pelt-specific?), however.

1)  The background-color needed for the rounded corners at the bottom of 
the pelt menu to blend in with the background of the page is the value 
white used for "content" (or "main"), not "body" (the initial value) 
unless "body" happens to remain set to "#FFFFFF" (white). Changing the 
"body" color something else (e.g., to match "footer" to visually extend 
the bottom frame to fill the screen) shows up in the background points 
of the rounded menu corners. Thus, one may need to add to skinconf.xml a 
"missing" color:

<color name="content" value="#FFFFFF" />


2)  The new color-name, "content" in my case (or "foo" as in the 
example), must then be used in screen.css, as per the example:

background-image: url(images/rc-b-r-15-1content-2menu-3menu.png);

but also in site2xhtml.xsl:

 <div id="roundbottom">
            <img 
                src="{$skin-img-dir}/rc-b-l-15-1content-2menu-3menu.png" 
                alt="" width="15" height="15" class="corner" 
                style="display: none" />
        </div>

Thanks for your help,
Maurice

Re: [Fwd: Pelt skin details]

[Thorsten Scherler <th...@apache.org>]

http://forrest.apache.org/0.7/docs/howto/howto-corner-images.html

HTH

On Thu, 2005-06-09 at 15:22 +0200, Maurice Lanselle wrote:
> Hello,
> 
> I found an answer to one of my own questions.
> 
> Q: The little detail the annoys me concerns the rounded corners on the 
> menu.  When I changed the "body" color I discovered that "body" in this 
> skin is not what the content is written on, but what appears below the 
> footer (when the page is short) and beneath the menu (in the "layers" 
> sense).  So when I changed this color to not white, the "pointy" parts 
> of the menu bottom corners showed up.
> 
> A: The bottom-left corner is set in site2xhtml.xsl:
>         <div id="roundbottom">
>             <img 
>                 src="{$skin-img-dir}/rc-b-l-15-1body-2menu-3menu.png" 
>                 alt="" width="15" height="15" class="corner" 
>                 style="display: none" />
>         </div>
> 
> Changing the src to "{$skin-img-dir}/rc-b-l-15-1content-2menu-3menu.png" makes its point disappear, too.
> 
> 
> It works!  But I'm even more confused now. It has "display: none" and it 
> is in a div with id=roundbottom, so why is the hidden image displayed 
> instead of the roundbottom(rc-b-r- ) background-image?  Off-topic, skip 
> it...I'll work it out.
> 
> 
> Regards,
> Maurice
> 
> 
> 
> a) I found in the screen.css
> 
> #roundbottom {
> background-image: url(images/rc-b-r-15-1body-2menu-3menu.png);
> background-repeat: no-repeat;
> background-position: top right;
> }
> Adding an entry in skinconf for
> <color name="content" value="#FFFFFF" />
> ("content" is not a color name in the standard list, BTW, in neither the
> skinconf.xml for a project nor the skinconf.xsl for pelt, but I find it
> useful in this case)
> and changing the roundbottom style to
> 
> #roundbottom {
> background-image: url(images/rc-b-r-15-1content-2menu-3menu.png);
> background-repeat: no-repeat;
> background-position: top right;
> }
> 
> worked, but only for the bottom right corner (rc-b-r appears to mean
> roundcorner-bottom-right). I cannot find the equivalent for the bottom
> left corner anywhere! And its point is still colored...can someone
> please tell me how to fix this corner, too?
> 
>  
-- 
thorsten

"Together we stand, divided we fall!" 
Hey you (Pink Floyd)