Hello Stephen,
Your screenshot suggests that you explicitly set black color... Try the
following selector:
af|navigationPane::bar-active-enabled af|navigationPane::bar-content
{
color: white;
}
If it doesn't work, use af|navigationPane::bar-active-enabled
af|navigationPane::bar-content a instead. Howeve, the first one should work,
unless you used some selector including "a" somewhere else in your skin.
Regards,
~ Simon
p.s. Had a supposed DNS error on last send, I hope that I won't spam the
mailing list with that second send.
On 8/14/07, Stephen Friedrich <[EMAIL PROTECTED]> wrote:
>
> Well, thanks for the explanations, they certainly help me understand.
> Unfortunately my two main problems still exist:
>
> * navigationPane (button style) - can't get white text (on dark blue
> background).
> This is what I tried, according to your suggestion:
> af|navigationPane::bar {
> background-color:#000076;
> }
>
> af|navigationPane::tabs-inactive af|navigationPane::tabs-mid {
> color:white;
> }
> I still get black text on dark blue background :-(
> See screenshot of my firebug session.
> Can it be that the descendant selector on the plain html tag "a"
> breaks stuff?
> I also tried adding "a" to the skin css, but that doesn't change
> anything.
>
> * clipped navigationPane in panelBox on IE 7:
> I see only the first one-and-a-quarter options (of three).
> In my skin I tried every possible combination of "height:100%" or
> "height:0"
> (for top/bottom) that I could think of. No luck.
> <tr:panelBox styleClass="left-nav" text="Basic Data"
> background="medium">
> <tr:navigationPane var="node" value="#{rootMenu}"
> level="1" hint="list">
> <f:facet name="nodeStamp">
> <tr:commandNavigationItem text="#{
> node.label}" action="#{node.doAction}"/>
> </f:facet>
> </tr:navigationPane>
> </tr:panelBox>
>
>
>
> Simon Lessard wrote:
> > Hello Stephen,
> >
> > See my comments below.
> >
> > On 8/14/07, *Stephen Friedrich* <[EMAIL PROTECTED]
> > <mailto:[EMAIL PROTECTED]>> wrote:
> >
> > Hi Simon,
> > thanks a lot for looking at this.
> >
> > Updates on the issues:
> > - vertical clipping on IE 7.0 happens on simple skin, too. It also
> > happens for
> > a "standalone" (not nested) navigationPane.
> > That quites an ugly bug, because it effectively makes the bottom
> > options
> > unreachable.
> > I have not been able to test this on IE 6.0.
> > Also that's quite hard to debug because there's no (real) firebug
> > for IE.
> >
> > - horizontal clipping/missing bullet at widest option:
> > That's a side effect of nesting the navigationPane in the start
> > facet of a
> > panelBorderLayout. Seems quite a common scenario to me, though.
> > I'll try and use a stupid-old self-defined table construct in my
> > facelets
> > template instead of panelBorderLayout :-(
> >
> > - ugly white line above the navigationPane's header on IE 7.0
> > I have this fixed by setting the grey background not only on
> > af|panelBox::medium af|panelBox::header
> > but also on
> > af|panelBox::medium
> > Header has no margin defined, so I don't really understand why
> > this is
> > necessary.
> >
> > In general it would have helped a lot if the skinning would be
> > documented
> > better:
> >
> > - How do I translate the generated CSS styles that I can see in
> > firebug back to the strange skinning-css syntax?
> >
> >
> > Underscores can be either | or :: , mostly :: though, it get translated
> > to | only after af.
> >
> > For example I have found the style that I need to change the
> navigation
> > pane's text color (in button style):
> > .af_navigationPane_tabs-inactive .af_navigationPane_tabs-mid a
> >
> >
> >
> >
> > af|navigationPane::tabs-inactive af|navigationPane::tabs-mid
> >
> > That one means a tab-mid located in an inactive tab. The a part if for
> > the link
> >
> > How do I specify that in my skin?
> >
> >
> > See above.
> >
> > - What's the difference between af|panelBox and af|panelBox::body?
> > After all there also are ::header and ::content ...
> >
> >
> > panelBox is a table structure with 3 rows with 3 cells each, af|panelBox
> > represents the whole table while af|panelBox::body represent cell (2, 2)
> > which is the middle cell where the content get generated. The 3x3
> > structure allow to define background images for corners, effectively
> > allowing to produce round edges (since MSIE is far from supporting those
> > natively with CSS). I somehow suspect that it's the cause of the problem
> > in IE 7 too. I assume that it try to render the row with non-zero height
> > even if there's nothing inside. So another fix you could try is to set
> > the af|panelBox::top selector, it's the one in charge of cell (1, 2).
> > The exact selector pattern is (for ltr):
> >
> > af|panelBox::light or af|panelBox::medium or af|panelBox::dark or
> > af|panelBox::transparent
> >
> _________________________________________________________________________________________
> >
> > | |
> > | |
> > | af|panelBox::top-start | af|panelBox::top |
> > af|panelBox::top-end |
> >
> |___________________________|__________________________________|_________________________|
> >
> > | |
> > | |
> > | | af|panelBox::body |
> > |
> > | | _______________________________
> > | |
> > | | | |
> > | |
> > | af|panelBox::start | | af|panelBox::header | |
> > af|panelBox::end |
> > | | |______________________________|
> > | |
> > | | | |
> > | |
> > | | | af|panelBox::content |
> > | |
> > | | |______________________________|
> > | |
> >
> |___________________________|__________________________________|_________________________|
> >
> > | |
> > | |
> > | af|panelBox::bottom-start | af|panelBox::bottom |
> > af|panelBox::bottom-end |
> >
> |___________________________|__________________________________|_________________________|
> >
> >
> >
> > Does that help?
> >
> >
> > Regards,
> >
> > ~ Simon
> >
> > Simon Lessard wrote:
> > > Hello Stephen,
> > >
> > > Hmmm, what kind of selector have you used to set the background
> > color?
> > > My hunch is that you set the color in an underlying DIV while it
> > should
> > > be on the cell itself maybe.
> > >
> > >
> > > Regards,
> > >
> > > ~ Simon
> > >
> > > On 8/14/07, *Stephen Friedrich* <[EMAIL PROTECTED]
> > <mailto:[EMAIL PROTECTED]>
> > > <mailto: [EMAIL PROTECTED] <mailto:[EMAIL PROTECTED]>>>
> wrote:
> > >
> > > Right, I should have mentioned that I am using IE7.0.
> > > I am not currently using the simple skin, but my own, but I
> > have tried
> > > every possible skin setting
> > > I could think of. Finally I worked around the size problems
> by
> > > specifying
> > > width/height in em units in my skin, but that's quite a hack
> > of course.
> > > At least it roughly works when scaling/zooming, but of course
> > it may
> > > fail
> > > if a translation uses longer strings.
> > >
> > > I am going to check both with the simple skin and with IE 6.0
> .
> > >
> > > I had hoped to avoid the css style browser incompatibility
> > hell by using
> > > only Trinidad components instead of html, but it seems that
> > was too
> > > optimistic.
> > >
> > >
> >
> >
>
>
>
