You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by Zigc Junk <zi...@gmail.com> on 2008/02/05 16:33:48 UTC
trinidad skining
I am trying to skin the navigationPane. Since I have two navigationPane
(tabs) instances (one top menu and one secondary menu), I want to put a
different skin on each of them. It seems to me that there is no way of doing
that. I can only create one skin which will be applied to all navigationPane
instances. Does anyone know how to do this?
thanks
Bill
Re: trinidad skining
Posted by Simon Lessard <si...@gmail.com>.
Nope, it works as designed, in your case you need to use "background-image:
none;" rather than inhibit because it's an entirely different CSS rule while
inhibit is for exact match rules coming from parent skin, not parent
selector.
Regards,
~ Simon
On Feb 5, 2008 1:30 PM, Zigc Junk <zi...@gmail.com> wrote:
> There is one minor issue. See below the Firebug style listing. In my
> listing, I have disabled the background image by -tr-inhibit:
> background-image; but it does not take effect. Is this a bug in trinidad or
> I did something wrong?
>
> thanks
>
> Bill
>
> .t_topMenu af|navigationPane::tabs-inactive af|navigationPane::tabs-mid {
> -tr-inhibit: background-image;
> background-color: #E8f6CA;
> border-top: 1px solid #528917;
> color: #528917;
> }
>
>
> .t_topMenu .af_navigationPane_tabs-inactive .af_navigationPane_tabs-mid {residential-deskt...
> (line 243)
> background-color:#E8F6CA;
> border-top:1px solid #528917;
> color:#528917;
> }
> .af_navigationPane_tabs-inactive .af_navigationPane_tabs-mid {residential-deskt...
> (line 83)
> background-image:url(/tcp-web/adf/images/tab3-mid-deselected.gif);
> color:#000000;
> }
>
>
> On Tue, Feb 5, 2008 at 11:54 AM, Scott O'Bryan <da...@gmail.com>
> wrote:
>
> > My way works if you are "embedding" one navigation pane in the other.
> > The example I gave would be for the "second" navigation pane, the first
> > would use the normal styling.
> >
> > Simons works if you don't mind adding a style class.
> >
> > Zigc Junk wrote:
> > > Tried again. Yes, the first syntax works.
> > >
> > > Thanks a lot
> > >
> > > Bill
> > >
> > > On Tue, Feb 5, 2008 at 11:20 AM, Simon Lessard
> > > <simon.lessard.3@gmail.com <ma...@gmail.com>> wrote:
> > >
> > > Hmmm, the first synthax should work just fine... can you check the
> > > generated CSS to see how the selector was reduced?
> > >
> > >
> > > On Feb 5, 2008 12:16 PM, Zigc Junk <zigcjunk@gmail.com
> > > <ma...@gmail.com>> wrote:
> > >
> > > Just tried both syntax and it does not seem to work. Below is
> > > the html code from Firebug. Note that I changed MyClass to
> > > t_topMenu. Do you know why?
> > >
> > > thanks
> > >
> > > Bill
> > >
> > > <div class="t_topMenu af_navigationPane_tabs">
> > > <table class="" cellspacing="0" cellpadding="0" border="0"
> > style="display:
> > > inline;" summary="">
> > > </table>
> > > <table class="" cellspacing="0" cellpadding="0" border="0"
> > style="display:
> > > inline;" summary="">
> > > <tbody style="display: inline;">
> > > <tr>
> > > <td>
> > > <table class="af_navigationPane_tabs-inactive" cellspacing="0"
> > cellpadding="0" border="0" summary="">
> > > <tbody>
> > > <tr>
> > > <td class="af_navigationPane_tabs-start-join-from-active"/>
> > > </tr>
> > > <tr>
> > > <td class="af_navigationPane_tabs-bottom-end">
> > > <div class="af_navigationPane_tabs-bottom-mid-content"/>
> > > </td>
> > > </tr>
> > > </tbody>
> > > </table>
> > > </td>
> > > <td>
> > > <table class="af_navigationPane_tabs-inactive" cellspacing="0"
> > cellpadding="0" border="0" summary="">
> > > <tbody>
> > > <tr>
> > > <td class="af_navigationPane_tabs-mid">
> > > <a id="j_id_id50:j_id_id54"
> > onclick="submitForm('rootForm',1,{source:'j_id_id50:j_id_id54'});return
> > > false;" href="#" name="j_id_id50:j_id_id54">Bills</a>
> > > </td>
> > > </tr>
> > > <tr>
> > > <td class="af_navigationPane_tabs-bottom-mid">
> > > <div class="af_navigationPane_tabs-bottom-mid-content"/>
> > > </td>
> > > </tr>
> > > </tbody>
> > > </table>
> > > </td>
> > > <td>
> > > </td>
> > > </tr>
> > > </tbody>
> > > </table>
> > >
> > >
> > > On Tue, Feb 5, 2008 at 11:01 AM, Simon Lessard
> > > <simon.lessard.3@gmail.com <ma...@gmail.com>>
> > > wrote:
> > >
> > > Hello Bill,
> > >
> > > The following should work:
> > >
> > > <tr:navigationPane hint="tabs" styleClass="MyClass">
> > >
> > > <tr:commandNavigationItem text="Home" />
> > > <tr:commandNavigationItem text="Bills" />
> > > <tr:commandNavigationItem text="Service History" />
> > > </tr:navigationPane>
> > >
> > > .MyClass af|navigationPane::tabs-inactive
> > > af|navigationPane::tabs-mid A
> > > {
> > > font-weight: bold;
> > > }
> > >
> > > or
> > >
> > > af|navigationPane.MyClass::tabs-inactive
> > > af|navigationPane::tabs-mid A
> > > {
> > > font-weight: bold;
> > > }
> > >
> > > The best way to know on what element the style class
> > > should be put is by using Firebug.
> > >
> > >
> > > Regards,
> > >
> > > ~ Simon
> > >
> > >
> > >
> > > On Feb 5, 2008 11:55 AM, Zigc Junk <zigcjunk@gmail.com
> > > <ma...@gmail.com>> wrote:
> > >
> > > Can you be more specific? Assume that I have the
> > > following navigationPane, how can I create a skin that
> > > is ONLY applied to this navigationPane.
> > >
> > > <tr:navigationPane hint="tabs">
> > > <tr:commandNavigationItem text="Home" />
> > > <tr:commandNavigationItem text="Bills" />
> > > <tr:commandNavigationItem text="Service
> > > History" />
> > > </tr:navigationPane>
> > >
> > > Here is one piece of the skin I created
> > > af|navigationPane::tabs-inactive
> > > af|navigationPane::tabs-mid A {
> > > font-weight: bold;
> > > }
> > >
> > > Thanks
> > >
> > > Bill
> > >
> > >
> > >
> > >
> > > On Feb 5, 2008 10:33 AM, Scott O'Bryan
> > > <darkarena@gmail.com <ma...@gmail.com>>
> > wrote:
> > >
> > > Zigc Junk wrote:
> > > > I am trying to skin the navigationPane. Since I
> > > have two
> > > > navigationPane (tabs) instances (one top menu
> > > and one secondary menu),
> > > > I want to put a different skin on each of them.
> > > It seems to me that
> > > > there is no way of doing that. I can only create
> > > one skin which will
> > > > be applied to all navigationPane instances. Does
> > > anyone know how to do
> > > > this?
> > > >
> > > > thanks
> > > >
> > > > Bill
> > > Use a compound key. If the second navigation pane
> > > is embedded in the
> > > first one, the key for the second pane might look
> > > something like this:
> > >
> > > af|navigationPane-tabs::tab:selected
> > > af|navigationPane-tabs::tab-content
> > >
> > >
> > >
> > >
> > >
> > >
> > >
> >
> >
>
Re: trinidad skining
Posted by Zigc Junk <zi...@gmail.com>.
There is one minor issue. See below the Firebug style listing. In my
listing, I have disabled the background image by -tr-inhibit:
background-image; but it does not take effect. Is this a bug in trinidad or
I did something wrong?
thanks
Bill
.t_topMenu af|navigationPane::tabs-inactive af|navigationPane::tabs-mid {
-tr-inhibit: background-image;
background-color: #E8f6CA;
border-top: 1px solid #528917;
color: #528917;
}
.t_topMenu .af_navigationPane_tabs-inactive
.af_navigationPane_tabs-mid {residential-deskt...
(line 243)
background-color:#E8F6CA;
border-top:1px solid #528917;
color:#528917;
}
.af_navigationPane_tabs-inactive .af_navigationPane_tabs-mid
{residential-deskt...
(line 83)
background-image:url(/tcp-web/adf/images/tab3-mid-deselected.gif);
color:#000000;
}
On Tue, Feb 5, 2008 at 11:54 AM, Scott O'Bryan <da...@gmail.com> wrote:
> My way works if you are "embedding" one navigation pane in the other.
> The example I gave would be for the "second" navigation pane, the first
> would use the normal styling.
>
> Simons works if you don't mind adding a style class.
>
> Zigc Junk wrote:
> > Tried again. Yes, the first syntax works.
> >
> > Thanks a lot
> >
> > Bill
> >
> > On Tue, Feb 5, 2008 at 11:20 AM, Simon Lessard
> > <simon.lessard.3@gmail.com <ma...@gmail.com>> wrote:
> >
> > Hmmm, the first synthax should work just fine... can you check the
> > generated CSS to see how the selector was reduced?
> >
> >
> > On Feb 5, 2008 12:16 PM, Zigc Junk <zigcjunk@gmail.com
> > <ma...@gmail.com>> wrote:
> >
> > Just tried both syntax and it does not seem to work. Below is
> > the html code from Firebug. Note that I changed MyClass to
> > t_topMenu. Do you know why?
> >
> > thanks
> >
> > Bill
> >
> > <div class="t_topMenu af_navigationPane_tabs">
> > <table class="" cellspacing="0" cellpadding="0" border="0"
> style="display:
> > inline;" summary="">
> > </table>
> > <table class="" cellspacing="0" cellpadding="0" border="0"
> style="display:
> > inline;" summary="">
> > <tbody style="display: inline;">
> > <tr>
> > <td>
> > <table class="af_navigationPane_tabs-inactive" cellspacing="0"
> cellpadding="0" border="0" summary="">
> > <tbody>
> > <tr>
> > <td class="af_navigationPane_tabs-start-join-from-active"/>
> > </tr>
> > <tr>
> > <td class="af_navigationPane_tabs-bottom-end">
> > <div class="af_navigationPane_tabs-bottom-mid-content"/>
> > </td>
> > </tr>
> > </tbody>
> > </table>
> > </td>
> > <td>
> > <table class="af_navigationPane_tabs-inactive" cellspacing="0"
> cellpadding="0" border="0" summary="">
> > <tbody>
> > <tr>
> > <td class="af_navigationPane_tabs-mid">
> > <a id="j_id_id50:j_id_id54"
> onclick="submitForm('rootForm',1,{source:'j_id_id50:j_id_id54'});return
> > false;" href="#" name="j_id_id50:j_id_id54">Bills</a>
> > </td>
> > </tr>
> > <tr>
> > <td class="af_navigationPane_tabs-bottom-mid">
> > <div class="af_navigationPane_tabs-bottom-mid-content"/>
> > </td>
> > </tr>
> > </tbody>
> > </table>
> > </td>
> > <td>
> > </td>
> > </tr>
> > </tbody>
> > </table>
> >
> >
> > On Tue, Feb 5, 2008 at 11:01 AM, Simon Lessard
> > <simon.lessard.3@gmail.com <ma...@gmail.com>>
> > wrote:
> >
> > Hello Bill,
> >
> > The following should work:
> >
> > <tr:navigationPane hint="tabs" styleClass="MyClass">
> >
> > <tr:commandNavigationItem text="Home" />
> > <tr:commandNavigationItem text="Bills" />
> > <tr:commandNavigationItem text="Service History" />
> > </tr:navigationPane>
> >
> > .MyClass af|navigationPane::tabs-inactive
> > af|navigationPane::tabs-mid A
> > {
> > font-weight: bold;
> > }
> >
> > or
> >
> > af|navigationPane.MyClass::tabs-inactive
> > af|navigationPane::tabs-mid A
> > {
> > font-weight: bold;
> > }
> >
> > The best way to know on what element the style class
> > should be put is by using Firebug.
> >
> >
> > Regards,
> >
> > ~ Simon
> >
> >
> >
> > On Feb 5, 2008 11:55 AM, Zigc Junk <zigcjunk@gmail.com
> > <ma...@gmail.com>> wrote:
> >
> > Can you be more specific? Assume that I have the
> > following navigationPane, how can I create a skin that
> > is ONLY applied to this navigationPane.
> >
> > <tr:navigationPane hint="tabs">
> > <tr:commandNavigationItem text="Home" />
> > <tr:commandNavigationItem text="Bills" />
> > <tr:commandNavigationItem text="Service
> > History" />
> > </tr:navigationPane>
> >
> > Here is one piece of the skin I created
> > af|navigationPane::tabs-inactive
> > af|navigationPane::tabs-mid A {
> > font-weight: bold;
> > }
> >
> > Thanks
> >
> > Bill
> >
> >
> >
> >
> > On Feb 5, 2008 10:33 AM, Scott O'Bryan
> > <darkarena@gmail.com <ma...@gmail.com>>
> wrote:
> >
> > Zigc Junk wrote:
> > > I am trying to skin the navigationPane. Since I
> > have two
> > > navigationPane (tabs) instances (one top menu
> > and one secondary menu),
> > > I want to put a different skin on each of them.
> > It seems to me that
> > > there is no way of doing that. I can only create
> > one skin which will
> > > be applied to all navigationPane instances. Does
> > anyone know how to do
> > > this?
> > >
> > > thanks
> > >
> > > Bill
> > Use a compound key. If the second navigation pane
> > is embedded in the
> > first one, the key for the second pane might look
> > something like this:
> >
> > af|navigationPane-tabs::tab:selected
> > af|navigationPane-tabs::tab-content
> >
> >
> >
> >
> >
> >
> >
>
>
Re: trinidad skining
Posted by Scott O'Bryan <da...@gmail.com>.
My way works if you are "embedding" one navigation pane in the other.
The example I gave would be for the "second" navigation pane, the first
would use the normal styling.
Simons works if you don't mind adding a style class.
Zigc Junk wrote:
> Tried again. Yes, the first syntax works.
>
> Thanks a lot
>
> Bill
>
> On Tue, Feb 5, 2008 at 11:20 AM, Simon Lessard
> <simon.lessard.3@gmail.com <ma...@gmail.com>> wrote:
>
> Hmmm, the first synthax should work just fine... can you check the
> generated CSS to see how the selector was reduced?
>
>
> On Feb 5, 2008 12:16 PM, Zigc Junk <zigcjunk@gmail.com
> <ma...@gmail.com>> wrote:
>
> Just tried both syntax and it does not seem to work. Below is
> the html code from Firebug. Note that I changed MyClass to
> t_topMenu. Do you know why?
>
> thanks
>
> Bill
>
> <div class="t_topMenu af_navigationPane_tabs">
> <table class="" cellspacing="0" cellpadding="0" border="0" style="display:
> inline;" summary="">
> </table>
> <table class="" cellspacing="0" cellpadding="0" border="0" style="display:
> inline;" summary="">
> <tbody style="display: inline;">
> <tr>
> <td>
> <table class="af_navigationPane_tabs-inactive" cellspacing="0" cellpadding="0" border="0" summary="">
> <tbody>
> <tr>
> <td class="af_navigationPane_tabs-start-join-from-active"/>
> </tr>
> <tr>
> <td class="af_navigationPane_tabs-bottom-end">
> <div class="af_navigationPane_tabs-bottom-mid-content"/>
> </td>
> </tr>
> </tbody>
> </table>
> </td>
> <td>
> <table class="af_navigationPane_tabs-inactive" cellspacing="0" cellpadding="0" border="0" summary="">
> <tbody>
> <tr>
> <td class="af_navigationPane_tabs-mid">
> <a id="j_id_id50:j_id_id54" onclick="submitForm('rootForm',1,{source:'j_id_id50:j_id_id54'});return
> false;" href="#" name="j_id_id50:j_id_id54">Bills</a>
> </td>
> </tr>
> <tr>
> <td class="af_navigationPane_tabs-bottom-mid">
> <div class="af_navigationPane_tabs-bottom-mid-content"/>
> </td>
> </tr>
> </tbody>
> </table>
> </td>
> <td>
> </td>
> </tr>
> </tbody>
> </table>
>
>
> On Tue, Feb 5, 2008 at 11:01 AM, Simon Lessard
> <simon.lessard.3@gmail.com <ma...@gmail.com>>
> wrote:
>
> Hello Bill,
>
> The following should work:
>
> <tr:navigationPane hint="tabs" styleClass="MyClass">
>
> <tr:commandNavigationItem text="Home" />
> <tr:commandNavigationItem text="Bills" />
> <tr:commandNavigationItem text="Service History" />
> </tr:navigationPane>
>
> .MyClass af|navigationPane::tabs-inactive
> af|navigationPane::tabs-mid A
> {
> font-weight: bold;
> }
>
> or
>
> af|navigationPane.MyClass::tabs-inactive
> af|navigationPane::tabs-mid A
> {
> font-weight: bold;
> }
>
> The best way to know on what element the style class
> should be put is by using Firebug.
>
>
> Regards,
>
> ~ Simon
>
>
>
> On Feb 5, 2008 11:55 AM, Zigc Junk <zigcjunk@gmail.com
> <ma...@gmail.com>> wrote:
>
> Can you be more specific? Assume that I have the
> following navigationPane, how can I create a skin that
> is ONLY applied to this navigationPane.
>
> <tr:navigationPane hint="tabs">
> <tr:commandNavigationItem text="Home" />
> <tr:commandNavigationItem text="Bills" />
> <tr:commandNavigationItem text="Service
> History" />
> </tr:navigationPane>
>
> Here is one piece of the skin I created
> af|navigationPane::tabs-inactive
> af|navigationPane::tabs-mid A {
> font-weight: bold;
> }
>
> Thanks
>
> Bill
>
>
>
>
> On Feb 5, 2008 10:33 AM, Scott O'Bryan
> <darkarena@gmail.com <ma...@gmail.com>> wrote:
>
> Zigc Junk wrote:
> > I am trying to skin the navigationPane. Since I
> have two
> > navigationPane (tabs) instances (one top menu
> and one secondary menu),
> > I want to put a different skin on each of them.
> It seems to me that
> > there is no way of doing that. I can only create
> one skin which will
> > be applied to all navigationPane instances. Does
> anyone know how to do
> > this?
> >
> > thanks
> >
> > Bill
> Use a compound key. If the second navigation pane
> is embedded in the
> first one, the key for the second pane might look
> something like this:
>
> af|navigationPane-tabs::tab:selected
> af|navigationPane-tabs::tab-content
>
>
>
>
>
>
>
Re: trinidad skining
Posted by Zigc Junk <zi...@gmail.com>.
Tried again. Yes, the first syntax works.
Thanks a lot
Bill
On Tue, Feb 5, 2008 at 11:20 AM, Simon Lessard <si...@gmail.com>
wrote:
> Hmmm, the first synthax should work just fine... can you check the
> generated CSS to see how the selector was reduced?
>
>
> On Feb 5, 2008 12:16 PM, Zigc Junk <zi...@gmail.com> wrote:
>
> > Just tried both syntax and it does not seem to work. Below is the html
> > code from Firebug. Note that I changed MyClass to t_topMenu. Do you know
> > why?
> >
> > thanks
> >
> > Bill
> >
> > <div class="t_topMenu af_navigationPane_tabs"> <table class=""
> > cellspacing="0" cellpadding="0" border="0" style="display: inline;"
> > summary="">
> > </table>
> > <table class="" cellspacing="0" cellpadding="0" border="0" style="display:
> > inline;" summary="">
> > <tbody style="display: inline;">
> > <tr>
> > <td>
> > <table class="af_navigationPane_tabs-inactive" cellspacing="0"
> > cellpadding="0" border="0" summary="">
> > <tbody>
> > <tr>
> > <td class="af_navigationPane_tabs-start-join-from-active"/>
> > </tr>
> > <tr>
> > <td class="af_navigationPane_tabs-bottom-end">
> > <div class="af_navigationPane_tabs-bottom-mid-content"/>
> > </td>
> > </tr>
> > </tbody>
> > </table>
> > </td>
> > <td>
> > <table class="af_navigationPane_tabs-inactive" cellspacing="0"
> > cellpadding="0" border="0" summary="">
> > <tbody>
> > <tr>
> > <td class="af_navigationPane_tabs-mid">
> > <a id="j_id_id50:j_id_id54" onclick="submitForm('rootForm',1,{source:'j_id_id50:j_id_id54'});return
> > false;" href="#" name="j_id_id50:j_id_id54">Bills</a>
> > </td>
> > </tr>
> > <tr>
> > <td class="af_navigationPane_tabs-bottom-mid">
> > <div class="af_navigationPane_tabs-bottom-mid-content"/>
> > </td>
> > </tr>
> > </tbody>
> > </table>
> > </td>
> > <td>
> > </td>
> > </tr>
> > </tbody>
> > </table>
> >
> >
> > On Tue, Feb 5, 2008 at 11:01 AM, Simon Lessard <
> > simon.lessard.3@gmail.com> wrote:
> >
> > > Hello Bill,
> > >
> > > The following should work:
> > >
> > > <tr:navigationPane hint="tabs" styleClass="MyClass">
> > > <tr:commandNavigationItem text="Home" />
> > > <tr:commandNavigationItem text="Bills" />
> > > <tr:commandNavigationItem text="Service History" />
> > > </tr:navigationPane>
> > >
> > > .MyClass af|navigationPane::tabs-inactive af|navigationPane::tabs-mid
> > > A
> > > {
> > > font-weight: bold;
> > > }
> > >
> > > or
> > >
> > > af|navigationPane.MyClass::tabs-inactive af|navigationPane::tabs-mid A
> > > {
> > > font-weight: bold;
> > > }
> > >
> > > The best way to know on what element the style class should be put is
> > > by using Firebug.
> > >
> > >
> > > Regards,
> > >
> > > ~ Simon
> > >
> > >
> > >
> > > On Feb 5, 2008 11:55 AM, Zigc Junk <zi...@gmail.com> wrote:
> > >
> > > > Can you be more specific? Assume that I have the following
> > > > navigationPane, how can I create a skin that is ONLY applied to this
> > > > navigationPane.
> > > >
> > > > <tr:navigationPane hint="tabs">
> > > > <tr:commandNavigationItem text="Home" />
> > > > <tr:commandNavigationItem text="Bills" />
> > > > <tr:commandNavigationItem text="Service History" />
> > > > </tr:navigationPane>
> > > >
> > > > Here is one piece of the skin I created
> > > > af|navigationPane::tabs-inactive af|navigationPane::tabs-mid A {
> > > > font-weight: bold;
> > > > }
> > > >
> > > > Thanks
> > > >
> > > > Bill
> > > >
> > > >
> > > >
> > > >
> > > > On Feb 5, 2008 10:33 AM, Scott O'Bryan <da...@gmail.com> wrote:
> > > >
> > > > > Zigc Junk wrote:
> > > > > > I am trying to skin the navigationPane. Since I have two
> > > > > > navigationPane (tabs) instances (one top menu and one secondary
> > > > > menu),
> > > > > > I want to put a different skin on each of them. It seems to me
> > > > > that
> > > > > > there is no way of doing that. I can only create one skin which
> > > > > will
> > > > > > be applied to all navigationPane instances. Does anyone know how
> > > > > to do
> > > > > > this?
> > > > > >
> > > > > > thanks
> > > > > >
> > > > > > Bill
> > > > > Use a compound key. If the second navigation pane is embedded in
> > > > > the
> > > > > first one, the key for the second pane might look something like
> > > > > this:
> > > > >
> > > > > af|navigationPane-tabs::tab:selected
> > > > > af|navigationPane-tabs::tab-content
> > > > >
> > > > >
> > > > >
> > > >
> > >
> >
>
Re: trinidad skining
Posted by Simon Lessard <si...@gmail.com>.
Hmmm, the first synthax should work just fine... can you check the generated
CSS to see how the selector was reduced?
On Feb 5, 2008 12:16 PM, Zigc Junk <zi...@gmail.com> wrote:
> Just tried both syntax and it does not seem to work. Below is the html
> code from Firebug. Note that I changed MyClass to t_topMenu. Do you know
> why?
>
> thanks
>
> Bill
>
> <div class="t_topMenu af_navigationPane_tabs"> <table class="" cellspacing
> ="0" cellpadding="0" border="0" style="display: inline;" summary="">
> </table>
> <table class="" cellspacing="0" cellpadding="0" border="0" style="display:
> inline;" summary="">
> <tbody style="display: inline;">
> <tr>
> <td>
> <table class="af_navigationPane_tabs-inactive" cellspacing="0" cellpadding
> ="0" border="0" summary="">
> <tbody>
> <tr>
> <td class="af_navigationPane_tabs-start-join-from-active"/>
> </tr>
> <tr>
> <td class="af_navigationPane_tabs-bottom-end">
> <div class="af_navigationPane_tabs-bottom-mid-content"/>
> </td>
> </tr>
> </tbody>
> </table>
> </td>
> <td>
> <table class="af_navigationPane_tabs-inactive" cellspacing="0" cellpadding
> ="0" border="0" summary="">
> <tbody>
> <tr>
> <td class="af_navigationPane_tabs-mid">
> <a id="j_id_id50:j_id_id54" onclick="submitForm('rootForm',1,{source:'j_id_id50:j_id_id54'});return
> false;" href="#" name="j_id_id50:j_id_id54">Bills</a>
> </td>
> </tr>
> <tr>
> <td class="af_navigationPane_tabs-bottom-mid">
> <div class="af_navigationPane_tabs-bottom-mid-content"/>
> </td>
> </tr>
> </tbody>
> </table>
> </td>
> <td>
> </td>
> </tr>
> </tbody>
> </table>
>
>
> On Tue, Feb 5, 2008 at 11:01 AM, Simon Lessard <si...@gmail.com>
> wrote:
>
> > Hello Bill,
> >
> > The following should work:
> >
> > <tr:navigationPane hint="tabs" styleClass="MyClass">
> > <tr:commandNavigationItem text="Home" />
> > <tr:commandNavigationItem text="Bills" />
> > <tr:commandNavigationItem text="Service History" />
> > </tr:navigationPane>
> >
> > .MyClass af|navigationPane::tabs-inactive af|navigationPane::tabs-mid A
> > {
> > font-weight: bold;
> > }
> >
> > or
> >
> > af|navigationPane.MyClass::tabs-inactive af|navigationPane::tabs-mid A
> > {
> > font-weight: bold;
> > }
> >
> > The best way to know on what element the style class should be put is by
> > using Firebug.
> >
> >
> > Regards,
> >
> > ~ Simon
> >
> >
> >
> > On Feb 5, 2008 11:55 AM, Zigc Junk <zi...@gmail.com> wrote:
> >
> > > Can you be more specific? Assume that I have the following
> > > navigationPane, how can I create a skin that is ONLY applied to this
> > > navigationPane.
> > >
> > > <tr:navigationPane hint="tabs">
> > > <tr:commandNavigationItem text="Home" />
> > > <tr:commandNavigationItem text="Bills" />
> > > <tr:commandNavigationItem text="Service History" />
> > > </tr:navigationPane>
> > >
> > > Here is one piece of the skin I created
> > > af|navigationPane::tabs-inactive af|navigationPane::tabs-mid A {
> > > font-weight: bold;
> > > }
> > >
> > > Thanks
> > >
> > > Bill
> > >
> > >
> > >
> > >
> > > On Feb 5, 2008 10:33 AM, Scott O'Bryan <da...@gmail.com> wrote:
> > >
> > > > Zigc Junk wrote:
> > > > > I am trying to skin the navigationPane. Since I have two
> > > > > navigationPane (tabs) instances (one top menu and one secondary
> > > > menu),
> > > > > I want to put a different skin on each of them. It seems to me
> > > > that
> > > > > there is no way of doing that. I can only create one skin which
> > > > will
> > > > > be applied to all navigationPane instances. Does anyone know how
> > > > to do
> > > > > this?
> > > > >
> > > > > thanks
> > > > >
> > > > > Bill
> > > > Use a compound key. If the second navigation pane is embedded in
> > > > the
> > > > first one, the key for the second pane might look something like
> > > > this:
> > > >
> > > > af|navigationPane-tabs::tab:selected
> > > > af|navigationPane-tabs::tab-content
> > > >
> > > >
> > > >
> > >
> >
>
Re: trinidad skining
Posted by Zigc Junk <zi...@gmail.com>.
Just tried both syntax and it does not seem to work. Below is the html code
from Firebug. Note that I changed MyClass to t_topMenu. Do you know why?
thanks
Bill
<div class="t_topMenu af_navigationPane_tabs"><table class="" cellspacing="0
" cellpadding="0" border="0" style="display: inline;" summary="">
</table>
<table class="" cellspacing="0" cellpadding="0" border="0" style="display:
inline;" summary="">
<tbody style="display: inline;">
<tr>
<td>
<table class="af_navigationPane_tabs-inactive" cellspacing="0" cellpadding="
0" border="0" summary="">
<tbody>
<tr>
<td class="af_navigationPane_tabs-start-join-from-active"/>
</tr>
<tr>
<td class="af_navigationPane_tabs-bottom-end">
<div class="af_navigationPane_tabs-bottom-mid-content"/>
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table class="af_navigationPane_tabs-inactive" cellspacing="0" cellpadding="
0" border="0" summary="">
<tbody>
<tr>
<td class="af_navigationPane_tabs-mid">
<a id="j_id_id50:j_id_id54"
onclick="submitForm('rootForm',1,{source:'j_id_id50:j_id_id54'});return
false;" href="#" name="j_id_id50:j_id_id54">Bills</a>
</td>
</tr>
<tr>
<td class="af_navigationPane_tabs-bottom-mid">
<div class="af_navigationPane_tabs-bottom-mid-content"/>
</td>
</tr>
</tbody>
</table>
</td>
<td>
</td>
</tr>
</tbody>
</table>
On Tue, Feb 5, 2008 at 11:01 AM, Simon Lessard <si...@gmail.com>
wrote:
> Hello Bill,
>
> The following should work:
>
> <tr:navigationPane hint="tabs" styleClass="MyClass">
> <tr:commandNavigationItem text="Home" />
> <tr:commandNavigationItem text="Bills" />
> <tr:commandNavigationItem text="Service History" />
> </tr:navigationPane>
>
> .MyClass af|navigationPane::tabs-inactive af|navigationPane::tabs-mid A
> {
> font-weight: bold;
> }
>
> or
>
> af|navigationPane.MyClass::tabs-inactive af|navigationPane::tabs-mid A
> {
> font-weight: bold;
> }
>
> The best way to know on what element the style class should be put is by
> using Firebug.
>
>
> Regards,
>
> ~ Simon
>
>
>
> On Feb 5, 2008 11:55 AM, Zigc Junk <zi...@gmail.com> wrote:
>
> > Can you be more specific? Assume that I have the following
> > navigationPane, how can I create a skin that is ONLY applied to this
> > navigationPane.
> >
> > <tr:navigationPane hint="tabs">
> > <tr:commandNavigationItem text="Home" />
> > <tr:commandNavigationItem text="Bills" />
> > <tr:commandNavigationItem text="Service History" />
> > </tr:navigationPane>
> >
> > Here is one piece of the skin I created
> > af|navigationPane::tabs-inactive af|navigationPane::tabs-mid A {
> > font-weight: bold;
> > }
> >
> > Thanks
> >
> > Bill
> >
> >
> >
> >
> > On Feb 5, 2008 10:33 AM, Scott O'Bryan <da...@gmail.com> wrote:
> >
> > > Zigc Junk wrote:
> > > > I am trying to skin the navigationPane. Since I have two
> > > > navigationPane (tabs) instances (one top menu and one secondary
> > > menu),
> > > > I want to put a different skin on each of them. It seems to me that
> > > > there is no way of doing that. I can only create one skin which will
> > > > be applied to all navigationPane instances. Does anyone know how to
> > > do
> > > > this?
> > > >
> > > > thanks
> > > >
> > > > Bill
> > > Use a compound key. If the second navigation pane is embedded in the
> > > first one, the key for the second pane might look something like this:
> > >
> > > af|navigationPane-tabs::tab:selected
> > > af|navigationPane-tabs::tab-content
> > >
> > >
> > >
> >
>
Re: trinidad skining
Posted by Simon Lessard <si...@gmail.com>.
Hello Bill,
The following should work:
<tr:navigationPane hint="tabs" styleClass="MyClass">
<tr:commandNavigationItem text="Home" />
<tr:commandNavigationItem text="Bills" />
<tr:commandNavigationItem text="Service History" />
</tr:navigationPane>
.MyClass af|navigationPane::tabs-inactive af|navigationPane::tabs-mid A
{
font-weight: bold;
}
or
af|navigationPane.MyClass::tabs-inactive af|navigationPane::tabs-mid A
{
font-weight: bold;
}
The best way to know on what element the style class should be put is by
using Firebug.
Regards,
~ Simon
On Feb 5, 2008 11:55 AM, Zigc Junk <zi...@gmail.com> wrote:
> Can you be more specific? Assume that I have the following navigationPane,
> how can I create a skin that is ONLY applied to this navigationPane.
>
> <tr:navigationPane hint="tabs">
> <tr:commandNavigationItem text="Home" />
> <tr:commandNavigationItem text="Bills" />
> <tr:commandNavigationItem text="Service History" />
> </tr:navigationPane>
>
> Here is one piece of the skin I created
> af|navigationPane::tabs-inactive af|navigationPane::tabs-mid A {
> font-weight: bold;
> }
>
> Thanks
>
> Bill
>
>
>
>
> On Feb 5, 2008 10:33 AM, Scott O'Bryan <da...@gmail.com> wrote:
>
> > Zigc Junk wrote:
> > > I am trying to skin the navigationPane. Since I have two
> > > navigationPane (tabs) instances (one top menu and one secondary menu),
> > > I want to put a different skin on each of them. It seems to me that
> > > there is no way of doing that. I can only create one skin which will
> > > be applied to all navigationPane instances. Does anyone know how to do
> > > this?
> > >
> > > thanks
> > >
> > > Bill
> > Use a compound key. If the second navigation pane is embedded in the
> > first one, the key for the second pane might look something like this:
> >
> > af|navigationPane-tabs::tab:selected af|navigationPane-tabs::tab-content
> >
> >
> >
>
Re: trinidad skining
Posted by Zigc Junk <zi...@gmail.com>.
Can you be more specific? Assume that I have the following navigationPane,
how can I create a skin that is ONLY applied to this navigationPane.
<tr:navigationPane hint="tabs">
<tr:commandNavigationItem text="Home" />
<tr:commandNavigationItem text="Bills" />
<tr:commandNavigationItem text="Service History" />
</tr:navigationPane>
Here is one piece of the skin I created
af|navigationPane::tabs-inactive af|navigationPane::tabs-mid A {
font-weight: bold;
}
Thanks
Bill
On Feb 5, 2008 10:33 AM, Scott O'Bryan <da...@gmail.com> wrote:
> Zigc Junk wrote:
> > I am trying to skin the navigationPane. Since I have two
> > navigationPane (tabs) instances (one top menu and one secondary menu),
> > I want to put a different skin on each of them. It seems to me that
> > there is no way of doing that. I can only create one skin which will
> > be applied to all navigationPane instances. Does anyone know how to do
> > this?
> >
> > thanks
> >
> > Bill
> Use a compound key. If the second navigation pane is embedded in the
> first one, the key for the second pane might look something like this:
>
> af|navigationPane-tabs::tab:selected af|navigationPane-tabs::tab-content
>
>
>
Re: trinidad skining
Posted by Scott O'Bryan <da...@gmail.com>.
Zigc Junk wrote:
> I am trying to skin the navigationPane. Since I have two
> navigationPane (tabs) instances (one top menu and one secondary menu),
> I want to put a different skin on each of them. It seems to me that
> there is no way of doing that. I can only create one skin which will
> be applied to all navigationPane instances. Does anyone know how to do
> this?
>
> thanks
>
> Bill
Use a compound key. If the second navigation pane is embedded in the
first one, the key for the second pane might look something like this:
af|navigationPane-tabs::tab:selected af|navigationPane-tabs::tab-content