myfaces-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Apache Wiki <>
Subject [Myfaces Wiki] Update of "Trinidad Skinning FAQ" by JWaldman
Date Wed, 24 Jan 2007 01:55:53 GMT
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:

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

View raw message