Author: cluts Date: 2008-01-25 11:23:20 -0500 (Fri, 25 Jan 2008) New Revision: 5639 Modified: trunk/docs/userguide/en/src/main/docbook/included/calendar.xml Log: http://jira.jboss.com/jira/browse/RF-1052 - correct for calendar Modified: trunk/docs/userguide/en/src/main/docbook/included/calendar.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/calendar.xml 2008-01-25 16:22:59 UTC (rev 5638) +++ trunk/docs/userguide/en/src/main/docbook/included/calendar.xml 2008-01-25 16:23:20 UTC (rev 5639) @@ -1288,7 +1288,7 @@ </mediaobject> </figure> - <table> + <table id="tab_cn3"> <title>Classes names that define an input field and a button appearance</title> <tgroup cols="2"> @@ -1584,35 +1584,65 @@ <para>In order to redefine styles for all <emphasis role="bold"> <property>&lt;rich:calendar&gt;</property> </emphasis> components on a page using CSS, it&apos;s enough to create classes with the - same names and define necessary properties in them.</para> + same names (possible classes could be found in the tables <link linkend="tab_cn3"> above</link>) and define necessary properties in them. </para> - <para>To change styles of particular <emphasis role="bold"> - <property>&lt;rich:calendar&gt;</property> - </emphasis> components, define your own style classes in the corresponding <emphasis - role="bold"> - <property>&lt;rich:calendar&gt;</property> - </emphasis>attributes.</para> + <para> + <emphasis role="bold">Example:</emphasis> + </para> + <programlisting role="CSS"><![CDATA[... +.rich-calendar-today { + background-color: #FF0000; +} +...]]></programlisting> - <para>CSS code piece used on a page:</para> + <para>This is a result:</para> + <figure> + <title>Redefinition styles with predefined classes</title> + <mediaobject> + <imageobject> + <imagedata fileref="images/calendar_CS1.png"/> + </imageobject> + </mediaobject> + </figure> + + <para>In the example an active cell background color was changed.</para> + + <para>Also it’s possible to change styles of particular <emphasis role="bold" + ><property>&lt;rich:calendar&gt;</property></emphasis> component. In this case you should create own style classes and use them in corresponding <emphasis role="bold" + ><property>&lt;rich:calendar&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[... -.rich-calendar-today { - background-color: #00FA9A; +.myFontClass{ + font-style: italic; } - .myClass { - font-size: xx-large; -} -...]]></programlisting> - <para>The component is defined in the following way:</para> +...]]></programlisting> + <para>The <emphasis><property>&quot;inputClass&quot;</property></emphasis> attribute for <emphasis role="bold" + ><property>&lt;rich:calendar&gt; </property></emphasis> is defined as it’s shown in the example below:</para> <para> <emphasis role="bold">Example:</emphasis> </para> - <programlisting role="XML"><![CDATA[<rich:calendar ... inputClass="myClass" .../>]]></programlisting> + <programlisting role="CSS"><![CDATA[<rich:calendar ... inputClass="myFontClass"/> +]]></programlisting> + <para>This is a result:</para> + + <figure> + <title>Redefinition styles with own classes and styleClass attributes</title> + <mediaobject> + <imageobject> + <imagedata fileref="images/calendar_CS2.png"/> + </imageobject> + </mediaobject> + </figure> + + <para>As it could be seen on the picture above, the font style for output text was changed.</para> + + </section> <section>