[richfaces-svn-commits] JBoss Rich Faces SVN: r12190 - trunk/docs/userguide/en/src/main/docbook/included.

[richfaces-svn-commits at lists.jboss.org]

Author: msorokin
Date: 2009-01-10 08:00:32 -0500 (Sat, 10 Jan 2009)
New Revision: 12190

Modified:
   trunk/docs/userguide/en/src/main/docbook/included/editor.xml
Log:
https://jira.jboss.org/jira/browse/RF-5042
The chapter is updated

Modified: trunk/docs/userguide/en/src/main/docbook/included/editor.xml
===================================================================
--- trunk/docs/userguide/en/src/main/docbook/included/editor.xml	2009-01-10 12:59:24 UTC (rev 12189)
+++ trunk/docs/userguide/en/src/main/docbook/included/editor.xml	2009-01-10 13:00:32 UTC (rev 12190)
@@ -1168,7 +1168,7 @@
                     
                     
                     </section>
-          <section>
+          <section id="EditorDefinitionofCustomStyleSelectors">
                     <title>Definition of Custom Style Selectors</title>
             
                               <para>On the screenshot there are CSS selectors  that define styles for component elements.</para>
@@ -1267,9 +1267,51 @@
                                         </tbody>
                               </tgroup>
                     </table>
+                    <para>In order to redefine styles for all <emphasis role="bold">
+                              <property>&lt;rich:editor&gt;</property>
+                    </emphasis> components on a page using CSS, it&apos;s enough to create classes with the
+                              same names (possible classes could be found in the tables <link linkend="EditorDefinitionofCustomStyleSelectors">above</link>) and define necessary properties in them.
+                    </para> 
                     
+                    <para>
+                              <emphasis role="bold">Example:</emphasis>
+                    </para>
+                    <programlisting role="CSS"><![CDATA[...
+.rich-progress-bar-remained{									
+    background-color: #ebf3fd;							
+}	
+...]]></programlisting>  
+                    
+                    <para>This is the result:</para>
+                    
+                    <figure>
+                              <title>Redefinition styles with predefined selectors</title>
+                              <mediaobject>
+                                        <imageobject>
+                                                  <imagedata fileref="images/editor4.png"/>
+                                        </imageobject>
+                              </mediaobject>
+                    </figure>
                    
-
+                    <para>It&apos;s also possible to change styles of a particular 
+                              <emphasis role="bold"> <property>&lt;rich:editor&gt;</property></emphasis> component. In this case you should create own style classes and use them in corresponding 
+                              <emphasis role="bold"><property>&lt;rich:editor&gt;</property></emphasis> <emphasis><property>styleClass</property></emphasis> attributes. An example is placed below:</para>
+                    <para>
+                              <emphasis role="bold">Example:</emphasis>
+                    </para>
+                    <programlisting role="CSS"><![CDATA[...
+.myClass{  
+margin-top: 20px;
+}
+...]]></programlisting>  
+                    <para>The <emphasis><property>&quot;styleClass&quot;</property></emphasis> attribute for <emphasis role="bold"
+                              ><property>&lt;rich:editor&gt; </property></emphasis> is defined as it&apos;s shown in the example below:</para>
+                    
+                    <para>
+                              <emphasis role="bold">Example:</emphasis>
+                    </para>
+                    <programlisting role="XML"><![CDATA[<rich:editor value="#{bean.text}" styleClass="myClass"/>
+]]></programlisting>