You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by Apache Wiki <wi...@apache.org> on 2007/01/24 02:55:53 UTC

[Myfaces Wiki] Update of "Trinidad Skinning FAQ" by JWaldman

Dear Wiki user,

You have subscribed to a wiki page or wiki category on "Myfaces Wiki" for change notification.

The following page has been changed by JWaldman:
http://wiki.apache.org/myfaces/Trinidad_Skinning_FAQ

The comment on the change is:
added section about the sample skin called 'purple' and its purpleSkin.css file

------------------------------------------------------------------------------
  
  === Where do I define my custom skin? ===
  In a nutshell, a skinner creates a skin by creating a css file and using the skin selectors found in the skin-selectors.html document. Example skins are in the demo bundle - purple and beach. Then the skinner creates a skin object by creating a <skin> element in the trinidad-skins.xml file. Child elements are <id>, <family>,<render-kit-id>, <style-sheet-name>, <bundle-name>, <extends>. Then in trinidad-config.xml, the application developer can set the <skin-family>.
+ 
+ === Where is an example skin that shows me all the skinning features? ===
+ In the trinidad-demo project, there is a purple skin defined. The skinning css file for the purple skin is in the file purpleSkin.css. In this file, we have tried to put in examples of all the skinning features, like inhibiting styles from base skins with '-tr-inhibit', including other style properties from other style classes with -tr-rule-ref, defining styles specifically when the browser's language is in right-to-left mode with :rtl,  using @agent and @platform skinning at-rules to specify styles for a specific agent and/or platform.
  
  === I'm a custom component developer, how do I add my skinning definitions to another skin, like the simple.desktop skin? ===
  You add your custom component skinning selectors and css properties to your custom stylesheet. Then, in trinidad-skins.xml, you add a <skin-addition> element. The child elements are <skin-id> and <style-sheet-name>. The <skin-id> will be the id of the skin you are adding your custom stylesheet to, like simple.desktop. The style-sheet-name is the name of your custom stylesheet. trinidad-skins.xml files can now be found inside a jar at META-INF/trinidad-skins.xml.