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>