Author: ochikvina Date: 2007-11-02 08:01:14 -0400 (Fri, 02 Nov 2007) New Revision: 3708 Modified: trunk/docs/userguide/en/src/main/docbook/included/simpleTogglePanel.xml trunk/docs/userguide/en/src/main/docbook/included/suggestionBox.xml trunk/docs/userguide/en/src/main/docbook/included/tab.xml trunk/docs/userguide/en/src/main/docbook/included/tabPanel.xml trunk/docs/userguide/en/src/main/docbook/included/toolBar.xml trunk/docs/userguide/en/src/main/docbook/included/toolBarGroup.xml trunk/docs/userguide/en/src/main/docbook/included/tooltip.xml Log: http://jira.jboss.com/jira/browse/RF-771 - unifying Look and feel customization section Modified: trunk/docs/userguide/en/src/main/docbook/included/simpleTogglePanel.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/simpleTogglePanel.xml 2007-11-02 11:56:19 UTC (rev 3707) +++ trunk/docs/userguide/en/src/main/docbook/included/simpleTogglePanel.xml 2007-11-02 12:01:14 UTC (rev 3708) @@ -116,23 +116,35 @@ </section> <section> <title>Look-and-Feel Customization</title> - <para>For skinnability implementation the components use a <emphasis> - <property>style class redefinition method</property> - </emphasis>.</para> - <para>Default style classes are mapped on <emphasis><property>skin - parameters</property>.</emphasis></para> - <para>To redefine appearance of all simpleTogglePanels at once, there are two ways:</para> + <para>For skinnability implementation, the components use a <emphasis> + <property>style class redefinition method.</property> + </emphasis> Default style classes are mapped on <emphasis> + <property>skin parameters.</property> + </emphasis></para> + + <para>There are two ways to redefine the appearance of all <emphasis role="bold"> + <property>&lt;rich:simpleTooglePanel&gt;</property> + </emphasis> components at once:</para> + <itemizedlist> - <listitem>to redefine corresponding skin parameters</listitem> - <listitem>to add <emphasis> + <listitem> + <para>Redefine the corresponding skin parameters</para> + </listitem> + + <listitem> + <para>Add to your style sheets <emphasis> <property>style classes</property> - </emphasis> used by the simpleTogglePanel to your page style sheets</listitem> + </emphasis> used by a <emphasis role="bold"> + <property>&lt;rich:simpleTooglePanel&gt;</property> + </emphasis> component</para> + </listitem> </itemizedlist> </section> + <section> <title>Skin Parameters Redefinition</title> <table> - <title>Skin parameters for the whole simpleTogglePanels</title> + <title>Skin parameters for a whole component</title> <tgroup cols="2"> <thead> <row> @@ -142,18 +154,18 @@ </thead> <tbody> <row> - <entry>overAllBackground</entry> + <entry>generalBackgroundColor</entry> <entry>background-color</entry> </row> <row> - <entry>tableBorderColor</entry> + <entry>panelBorderColor</entry> <entry>border-color</entry> </row> </tbody> </tgroup> </table> <table> - <title>Parameters for a header element</title> + <title>Skin parameters for a header element</title> <tgroup cols="2"> <thead> <row> @@ -167,6 +179,10 @@ <entry>background-color</entry> </row> <row> + <entry>headerBackgroundColor</entry> + <entry>border-color</entry> + </row> + <row> <entry>headerSizeFont</entry> <entry>font-size </entry> </row> @@ -175,7 +191,7 @@ <entry>color</entry> </row> <row> - <entry>preferableHeaderWeightFont</entry> + <entry>headerWeightFont</entry> <entry>font-weight</entry> </row> <row> @@ -186,7 +202,7 @@ </tgroup> </table> <table> - <title>Parameters for a body element</title> + <title>Skin parameters for a body element</title> <tgroup cols="2"> <thead> <row> @@ -196,11 +212,11 @@ </thead> <tbody> <row> - <entry>overAllBackground</entry> + <entry>generalBackgroundColor</entry> <entry>background-color</entry> </row> <row> - <entry>preferableDataSizeFont</entry> + <entry>generalSizeFont</entry> <entry>font-size</entry> </row> <row> @@ -208,7 +224,7 @@ <entry>color</entry> </row> <row> - <entry>preferableDataFamilyFont</entry> + <entry>generalFamilyFont</entry> <entry>font-family</entry> </row> </tbody> @@ -217,18 +233,18 @@ </section> <section> <title>Definition of Custom Style Classes</title> + + <para>On the screenshot there are classes names that define styles for component elements.</para> + <figure> - <title>Style classes of simpleTogglePanel</title> + <title>Style classes</title> <mediaobject> <imageobject> <imagedata fileref="images/simpleTogglePanel3.png"/> </imageobject> </mediaobject> </figure> - <para>On the screenshot, there are specific classes names that define specified elements. Except - these two classes, one more class specified for the whole wrapper <emphasis role="bold"> - <property>&lt;div&gt;</property> - </emphasis> element. See the table:</para> + <table> <title>Classes names that define a component appearance</title> <tgroup cols="2"> @@ -241,20 +257,20 @@ <tbody> <row> <entry>rich-stglpanel</entry> - <entry>Defines styles for a wrapper &lt;div&gt; element of a simpleTogglePanel</entry> + <entry>Defines styles for a wrapper &lt;div&gt; element of a component</entry> </row> <row> <entry>rich-stglpanel-header</entry> - <entry>Defines styles for header element of a simpleTogglePanel</entry> + <entry>Defines styles for header element of a component</entry> </row> <row> <entry>rich-stglpnl-marker</entry> - <entry>Defines styles for a wrapper &lt;div&gt; element for a marker</entry> + <entry>Defines styles for a wrapper &lt;div&gt; element of a marker</entry> </row> <row> <entry>rich-stglpanel-body</entry> - <entry>Defines styles for a simpleTogglePanel body</entry> + <entry>Defines styles for a component content</entry> </row> </tbody> </tgroup> Modified: trunk/docs/userguide/en/src/main/docbook/included/suggestionBox.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/suggestionBox.xml 2007-11-02 11:56:19 UTC (rev 3707) +++ trunk/docs/userguide/en/src/main/docbook/included/suggestionBox.xml 2007-11-02 12:01:14 UTC (rev 3708) @@ -236,19 +236,28 @@ <section> <title>Look-and-Feel Customization</title> + + <para>For skinnability implementation, the components use a <emphasis> + <property>style class redefinition method.</property> + </emphasis> Default style classes are mapped on <emphasis> + <property>skin parameters.</property> + </emphasis></para> - <para>For skinnability implementation, the components use a style class redefinition method. - Default style classes are mapped on skin parameters.</para> + <para>There are two ways to redefine the appearance of all <emphasis role="bold"> + <property>&lt;rich:suggestionBox&gt;</property> + </emphasis> components at once:</para> - <para>There are two ways to redefine the appearance of all suggestionbox at once:</para> - <itemizedlist> <listitem> <para>Redefine the corresponding skin parameters</para> </listitem> <listitem> - <para>Add to your style sheets style classes used by a suggestionbox</para> + <para>Add to your style sheets <emphasis> + <property>style classes</property> + </emphasis> used by a <emphasis role="bold"> + <property>&lt;rich:suggestionBox&gt;</property> + </emphasis> component</para> </listitem> </itemizedlist> </section> Modified: trunk/docs/userguide/en/src/main/docbook/included/tab.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/tab.xml 2007-11-02 11:56:19 UTC (rev 3707) +++ trunk/docs/userguide/en/src/main/docbook/included/tab.xml 2007-11-02 12:01:14 UTC (rev 3708) @@ -155,22 +155,34 @@ </section> <section> <title>Look-and-Feel Customization</title> - <para>For skinnability implementation the components use <emphasis - -><property>style class redefinition method</property>.</emphasis> -Default style classes are mapped on <emphasis - -><property>skin parameters</property>.</emphasis></para> + + <para>For skinnability implementation, the components use a <emphasis> + <property>style class redefinition method.</property> + </emphasis> Default style classes are mapped on <emphasis> + <property>skin parameters.</property> + </emphasis></para> + <note><title>Note:</title> A panel appearance and content is defined with a <property>tab</property> panel i.e. on the <property>tab</property> level it&apos;s possible to define only an appearance of this <property>tab</property> header. </note> - <para>To redefine appearance of all tabs at once, there are two ways:</para> - <itemizedlist> - <listitem>to redefine corresponding skin parameters</listitem> - <listitem>to add <emphasis -><property>style classes</property></emphasis> used by the tab to your page style sheets</listitem> - </itemizedlist> - + + <para>There are two ways to redefine the appearance of all <emphasis role="bold"> + <property>&lt;rich:tab&gt;</property> + </emphasis> components at once:</para> + + <itemizedlist> + <listitem> + <para>Redefine the corresponding skin parameters</para> + </listitem> + + <listitem> + <para>Add to your style sheets <emphasis> + <property>style classes</property> + </emphasis> used by a <emphasis role="bold"> + <property>&lt;rich:tab&gt;</property> + </emphasis> component</para> + </listitem> + </itemizedlist> </section> <section> <title>Definition of Custom Style Classes</title> Modified: trunk/docs/userguide/en/src/main/docbook/included/tabPanel.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/tabPanel.xml 2007-11-02 11:56:19 UTC (rev 3707) +++ trunk/docs/userguide/en/src/main/docbook/included/tabPanel.xml 2007-11-02 12:01:14 UTC (rev 3708) @@ -153,17 +153,29 @@ </section> <section> <title>Look-and-Feel Customization</title> - <para>For skinnability implementation the components use a <emphasis> - <property>style class redefinition method</property> - </emphasis>.</para> - <para>Default style classes are mapped on <emphasis><property>skin - parameters</property>.</emphasis></para> - <para>To redefine appearance of all tabPanels at once, there are two ways:</para> + + <para>For skinnability implementation, the components use a <emphasis> + <property>style class redefinition method.</property> + </emphasis> Default style classes are mapped on <emphasis> + <property>skin parameters.</property> + </emphasis></para> + + <para>There are two ways to redefine the appearance of all <emphasis role="bold"> + <property>&lt;rich:tabPanel&gt;</property> + </emphasis> components at once:</para> + <itemizedlist> - <listitem>to redefine corresponding skin parameters</listitem> - <listitem>to add <emphasis> + <listitem> + <para>Redefine the corresponding skin parameters</para> + </listitem> + + <listitem> + <para>Add to your style sheets <emphasis> <property>style classes</property> - </emphasis> used by the tabPanel to your page style sheets</listitem> + </emphasis> used by a <emphasis role="bold"> + <property>&lt;rich:tabPanel&gt;</property> + </emphasis> component</para> + </listitem> </itemizedlist> </section> Modified: trunk/docs/userguide/en/src/main/docbook/included/toolBar.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/toolBar.xml 2007-11-02 11:56:19 UTC (rev 3707) +++ trunk/docs/userguide/en/src/main/docbook/included/toolBar.xml 2007-11-02 12:01:14 UTC (rev 3708) @@ -104,18 +104,34 @@ </section> <section> <title>Look-and-Feel Customization</title> - <para>For skinnability implementation the components use a <emphasis> - <property>style class redefinition method</property> - </emphasis>.</para> - <para>Default style classes are mapped on <emphasis><property>skin - parameters</property>.</emphasis></para> - <para>To redefine appearance of all toolBars at once, there are two ways:</para> + + <para>For skinnability implementation, the components use a <emphasis> + <property>style class redefinition method.</property> + </emphasis> Default style classes are mapped on <emphasis> + <property>skin parameters.</property> + </emphasis></para> + + <para>There are two ways to redefine the appearance of all <emphasis role="bold"> + <property>&lt;rich:toolBar&gt;</property> + </emphasis> components at once:</para> + <itemizedlist> - <listitem>to redefine corresponding skin parameters</listitem> - <listitem>to add <emphasis> + <listitem> + <para>Redefine the corresponding skin parameters</para> + </listitem> + + <listitem> + <para>Add to your style sheets <emphasis> <property>style classes</property> - </emphasis> used by the toolBar to your page style sheets</listitem> + </emphasis> used by a <emphasis role="bold"> + <property>&lt;rich:toolBar&gt;</property> + </emphasis> component</para> + </listitem> </itemizedlist> + </section> + + <section> + <title>Skin Parameters Redefinition</title> <table> <title>Skin parameters redefinition</title> <tgroup cols="2"> @@ -137,7 +153,8 @@ </tbody> </tgroup> </table> - </section> + </section> + <section> <title>Definition of Custom Style Classes</title> <table> Modified: trunk/docs/userguide/en/src/main/docbook/included/toolBarGroup.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/toolBarGroup.xml 2007-11-02 11:56:19 UTC (rev 3707) +++ trunk/docs/userguide/en/src/main/docbook/included/toolBarGroup.xml 2007-11-02 12:01:14 UTC (rev 3708) @@ -75,7 +75,65 @@ ... ]]></programlisting> </section> + <section> + <title>Look-and-Feel Customization</title> + + <para>For skinnability implementation, the components use a <emphasis> + <property>style class redefinition method.</property> + </emphasis> Default style classes are mapped on <emphasis> + <property>skin parameters.</property> + </emphasis></para> + + <para>There are two ways to redefine the appearance of all <emphasis role="bold"> + <property>&lt;rich:toolBarGroup&gt;</property> + </emphasis> components at once:</para> + + <itemizedlist> + <listitem> + <para>Redefine the corresponding skin parameters</para> + </listitem> + + <listitem> + <para>Add to your style sheets <emphasis> + <property>style classes</property> + </emphasis> used by a <emphasis role="bold"> + <property>&lt;rich:toolBarGroup&gt;</property> + </emphasis> component</para> + </listitem> + </itemizedlist> + </section> + + <section> + <title>Skin Parameters Redefinition</title> + <table> + <title>Skin parameters redefinition</title> + <tgroup cols="2"> + <thead> + <row> + <entry>Skin parameters for the toolBarGroup component</entry> + <entry>Corresponding CSS parameters</entry> + </row> + </thead> + <tbody> + <row> + <entry>headerSizeFont</entry> + <entry>font-size</entry> + </row> + <row> + <entry>headTextColor</entry> + <entry>color</entry> + </row> + <row> + <entry>headerFamilyFont</entry> + <entry>font-family</entry> + </row> + </tbody> + </tgroup> + </table> + </section> + + <section> <title>Details of Usage</title> <para>A <property>toolBarGroup</property> is a wrapper component that groups <property>toolBar</property> content and facilitates creation of menu and tool bars. All components defined inside are located on a stylized bar with a possibility to group, arrange on the both bar sides, and place predefined separators between them.</para> <para>Separators are located between components with the help of the <emphasis @@ -123,43 +181,6 @@ </mediaobject> </figure> </section> - <section> - <title>Look-and-Feel Customization</title> - <para>For skinnability implementation the components use a <emphasis -><property>style class redefinition method</property></emphasis>.</para> - <para>Default style classes are mapped on <emphasis -><property>skin parameters</property>.</emphasis></para> - <para>To redefine appearance of all toolBarGroups at once, there are two ways:</para> - <itemizedlist> - <listitem>to redefine corresponding skin parameters</listitem> - <listitem>to add <emphasis -><property>style classes</property></emphasis> used by the toolBarGroup to your page style sheets</listitem> - </itemizedlist> - <table> - <title>Skin parameters redefinition</title> - <tgroup cols="2"> - <thead> - <row> - <entry>Skin parameters for the toolBarGroup component</entry> - <entry>Corresponding CSS parameters</entry> - </row> - </thead> - <tbody> - <row> - <entry>headerSizeFont</entry> - <entry>font-size</entry> - </row> - <row> - <entry>headTextColor</entry> - <entry>color</entry> - </row> - <row> - <entry>headerFamilyFont</entry> - <entry>font-family</entry> - </row> - </tbody> - </tgroup> - </table> - </section> + </section> \ No newline at end of file Modified: trunk/docs/userguide/en/src/main/docbook/included/tooltip.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/tooltip.xml 2007-11-02 11:56:19 UTC (rev 3707) +++ trunk/docs/userguide/en/src/main/docbook/included/tooltip.xml 2007-11-02 12:01:14 UTC (rev 3708) @@ -188,17 +188,34 @@ <section> <title>Look-and-Feel Customization</title> - <para>For skinnability implementation the components, use a <emphasis><property>style class redefinition method</property></emphasis>. - </para> - <para>Default style classes are mapped on <emphasis><property>skin parameters</property>.</emphasis></para> - - <para>To redefine appearance of all <property>tooltip</property> at once, there are two ways:</para> - <itemizedlist> - <listitem>to redefine the corresponding skin parameters</listitem> - <listitem>to add to your style sheets style classes used by a <property>tooltip</property></listitem> - </itemizedlist> - - <para> + + <para>For skinnability implementation, the components use a <emphasis> + <property>style class redefinition method.</property> + </emphasis> Default style classes are mapped on <emphasis> + <property>skin parameters.</property> + </emphasis></para> + + <para>There are two ways to redefine the appearance of all <emphasis role="bold"> + <property>&lt;rich:tooltip&gt;</property> + </emphasis> components at once:</para> + + <itemizedlist> + <listitem> + <para>Redefine the corresponding skin parameters</para> + </listitem> + + <listitem> + <para>Add to your style sheets <emphasis> + <property>style classes</property> + </emphasis> used by a <emphasis role="bold"> + <property>&lt;rich:tooltip&gt;</property> + </emphasis> component</para> + </listitem> + </itemizedlist> + + </section> + <section> + <title>Skin Parameters Redefinition</title> <table> <title>Skin parameters redefinition</title> <tgroup cols="2"> @@ -232,7 +249,7 @@ </tbody> </tgroup> </table> - </para> + </section>