Oups, my bad, I should have checked. I guess it's time for me to make myself a bit more useful since I play with skin on daily basis...
On 8/9/07, Adam Winer <[EMAIL PROTECTED]> wrote: > > ... but unfortunately, navigationPane is specifically not > documented there. I cleaned up a lot of the skin selectors > doc, but it would be great for someone to take on that > remaining task (hint, hint, committers) :) > > -- Adam > > > On 8/9/07, Simon Lessard <[EMAIL PROTECTED]> wrote: > > Hello again Dunia, > > > > You can find the selector list at > > http://myfaces.apache.org/trinidad/skin-selectors.html. > > Also, you can always check what selectors are being rendered on the > client > > with the help of Firebug (for Firefox browser). Also, if you don't want > the > > selector names to be compressed (making them very hard to identify), add > the > > following context param to your web.xml file: > > > > <context-param> > > <param-name> > > org.apache.myfaces.trinidadinternal.DISABLE_CONTENT_COMPRESSION > </param-name> > > <param-value>true</param-value> > > </context-param> > > > > > > > > Regards, > > > > ~ Simon > > > > > > On 8/9/07, Azim, Dunia <[EMAIL PROTECTED]> wrote: > > > > > > > > > Simon, thanks a lot for your extensive comments! > > > So best practice seems to be customizing the respective > af|navigationpane > > selectors and using my own selectors only where there are no defaults. > The > > difficulty with that approach is, that I can't find any specification > for > > the navigationpane selector and its subkeys, and respectively for the > > commandNavigationItem, neither at the Trinidad nor at the Oracle > website. > > > > > > Does anyone have an idea where to find such a documentation? Or at > least, > > where I can find those base-desktop.xss and simple-desktop.xss > > (minimal-desktop.xss) files, which where occasionally mentioned in the > > mailing list? I'm working with Trinidad 1.2 . > > > > > > best regards, > > > Dunia > > > > > > > > > ________________________________ > > Von: Simon Lessard [mailto:[EMAIL PROTECTED] > > > Gesendet: Donnerstag, 9. August 2007 18:19 > > > An: MyFaces Discussion > > > Betreff: Re: [Trinidad] using a custom skin > > > > > > > > > > > > Hello Dunia, > > > > > > See my comments below. > > > > > > > > > Regards, > > > > > > ~ Simon > > > > > > > > > On 8/9/07, Azim, Dunia <[EMAIL PROTECTED] > wrote: > > > > > > > > Hi there, > > > > > > > > is there any reliable documentation or complete example on how to > > implement Trinidad Skins? > > > > After going through all documentation on > > http://myfaces.apache.org/trinidad/release.html > > (Skin Selector Keys and Converting from ADF to Trinidad) > > and studying the Demo-Examples, we neither find a way how to have a > custom > > skin rendered, nor which default selector could be customized for e.g. a > > commandNavigationItem component. Creating a custom class, there is > always > > some default overriding the custom selector. > > > > > > > > > It's true that we need more skinning documentation. > > > > > > > > > > It would be great, if somebody could review the > > following code snippets, to give us a hint, what's going wrong or > lacking. > > > > > > > > Thanks a lot! > > > > > > > > => We tried with just one selector class, putting "-tr-inhibit: all" > at > > the beginning, but font-size and -weight are not recognized. > > > > > > > > So our desktopSkin.css looks like: > > > > > > > > .mainNavigationBar { > > > > -tr-inhibit: all; > > > > font-family : verdana, Geneva, Arial, Helvetica, sans-serif; > > > > font-size: 18px; > > > > font-weight: bold; > > > > padding: 6px; > > > > color: #000000; > > > > background-color:lightgrey; > > > > } > > > > > > > > > -tr-inhibit removes inherited properties. Since mainNavigationBar is > not a > > known selector it won't inherit any properties and thus -tr-inhibit > won't do > > anything. For navigationPane component, the valid selectors start with > > af|navigationPane. > > > > > > > > > > The trinidad-config.xml : > > > > <trinidad-config xmlns=" > > http://myfaces.apache.org/trinidad/config";> > > > > <debug-output>true</debug-output> > > > > <skin-family>prostep</skin-family> > > > > or: > > > > <skin-family>#{sessionScope.skinFamily }</skin-family> > > > > ... > > > > > > > > > This is good. > > > > > > > > > > The trinidad-skins.xml : > > > > <skins xmlns=" > > http://myfaces.apache.org/trinidad/skin";> > > > > <skin> > > > > <id>prostep.desktop</id> > > > > <family>prostep</family> > > > > <!-- <extends> minimal.desktop</extends> --> > > > > > > <render-kit-id>org.apache.myfaces.trinidad.desktop</render-kit-id> > > > > > > <style-sheet-name>skins/desktopSkin.css</style-sheet-name> > > > > </skin> > > > > </skins> > > > > > > > > > Good here as well. > > > > > > > > > > Source code of our MainNavigation.jspx which is to > > implement the style: > > > > > > > > <?xml version="1.0" encoding="iso-8859-1" standalone="yes" ?> > > > > <jsp:root xmlns:jsp=" http://java.sun.com/JSP/Page"; version="2.0" > > > > xmlns:f="http://java.sun.com/jsf/core"; > > > > xmlns:h=" http://java.sun.com/jsf/html"; > > > > > > xmlns:trh="http://myfaces.apache.org/trinidad/html > > " > > > > xmlns:tr=" > > http://myfaces.apache.org/trinidad";> > > > > <jsp:directive.page > > contentType="text/html;charset=utf-8" /> > > > > <f:view> > > > > <trh:html> > > > > <trh:head title="Skin Demo"> > > > > <!-- > > > > <link rel="stylesheet" charset="UTF-8" type="text/css" > > > > > > href="/WebTest1/adf/styles/cache/desktopSkin.css"/> > > > > > > href="/WebTest1/faces/skins/desktopSkin.css" > > > > > > href="/faces/skins/desktopSkin.css" > > > > > > href="/WebTest1/skins/desktopSkin.css" > > > > > > href="WebTest1/skins/desktopSkin.css" > > > > href="skins/desktopSkin.css" > > > > href="/skins/desktopSkin.css" > > > > --> > > > > > > > > > You don't have to link to the CSS if you use either trh:head or > > tr:document which is your case here. > > > > > > > > > > </trh:head> > > > > <trh:body> > > > > <tr:navigationPane hint="bar" id="mainNavigation" > > styleClass="mainNavigationBar"> > > > > <tr:commandNavigationItem > > text="Upload"></tr:commandNavigationItem> > > > > <tr:commandNavigationItem text="New > > Items"></tr:commandNavigationItem> > > > > <tr:commandNavigationItem > > text="Webspaces" > > styleClass="mainNavigationBar"></tr:commandNavigationItem> > > > > ... > > > > > > > > > You don't have to set the style class if you use the good selectors > > (af|navigationPane in that case) > > > > > > > > > > => instead of the <trh:head> and <trh:body> we tried with a > > <tr:document> tag, but neither it worked. > > > > => What about the <link> tag in the code above? > > > > > > > > > Not needed. > > > > > > > > > > Do we have to include the stylesheet file at all? If YES, what's the > > correct uri? > > > > > > > > > No. > > > > > > > > > > => It doesn't seem to be necessary, as the source code > > in Mozilla either way shows something like: <link rel="stylesheet" > > charset="UTF-8" type="text/css" > > href="/WebTest1/adf/styles/cache/prostep- > > desktop-1120493713-gecko-cmp.css;jsessionid=..."> > > > > => further within the commandNavigationItem's element tag the > browser > > reads: class="mainNavigationBar > > af_navigationPane_bar-inactive-enabled" ... => What does > > that mean? > > > > > > > > > This mean that the skin selector that was used was > > af|navigationPane::bar-inactive-enabled for the item and > > also included the style class that you defined in the page, i.e. > > mainNavigationBar. > > > > > > > MainNavigation.jspx is addressed from a > > frameBorderLayout: > > > > > > > > <f:facet name="center"> > > > > <trh:frameBorderLayout width="80%" height="80pt"> > > > > <f:facet name="top"> > > > > <trh:frame > > source="/MainNavigation.jspx" width="100%" height="40pt" scrolling="no" > > marginHeight="0" marginWidth="0"></trh:frame> > > > > </f:facet> > > > > ... > > > > > > > > Sorry, lots of questions. But at least getting some precise hints on > the > > basics would be really great. > > > > Dunia Azim > > > > > > > > > > > > > > > > ________________________________________________________________________ > > > PROSTEP AG, Dolivostraße 11, D-64293 Darmstadt > > > HR: Amtsgericht Darmstadt, HRB 8383 > > > Vorstand: Dr. Bernd Pätzold (Vorsitz), Reinhard Betz > > > Aufsichtsrat: Dr. Heinz-Gerd Lehnhoff (Vorsitz) > > > > > ________________________________________________________________________ > > > > > > > >
