added new article for important changes of decorating headings;moved changes and backwards compatibility article in the new folder

controls/formdecorator/changes-and-backward-compatibility.md → controls/formdecorator/changes-and-backwards-compatibility/changes-and-backward-compatibility.md

@@ -1,47 +1,48 @@
----
-title: Changes And Backward Compatibility
-page_title: Changes And Backward Compatibility | RadFormDecorator for ASP.NET AJAX Documentation
-description: Changes And Backward Compatibility
-slug: formdecorator/changes-and-backward-compatibility
-tags: changes,and,backward,compatibility
-published: True
-position: 1
----
-
-# Changes And Backward Compatibility
-
-## RadFormDecorator for ASP.NET AJAX
-
-A complete list of all changes can be found on Release History page: [http://www.telerik.com/products/aspnet-ajax/whats-new/release-history.aspx](http://www.telerik.com/products/aspnet-ajax/whats-new/release-history.aspx)
-
-## Telerik RadFormDecorator for ASP.NET AJAX Q2 2010
-
-**Breaking Change:** Before Q2 2010, RadFormDecorator will style checkboxes and radiobuttons even if they have a class property assigned. From Q2 2010 this behavior is changed - RadFormDecorator will style them only if they don't have a class property assigned.
-
-## Telerik RadFormDecorator for ASP.NET AJAX Q1 2010
-
-Buttons' height is increased to 22px. in order to fit and look better when placed next to RadInput or RadComboBox items. The previous button height was 21px. If you are using a custom skin, based on previous version, you should change your main skin's CSS as shown in this sticky forum thread.
-
-## Telerik RadFormDecorator for ASP.NET AJAX Q3 2009
-
-RadFormDecorator for ASP.NET AJAX which is part of the Q3 2009 release is fully backwards compatible with its previous version (Q2 2009).
-
-## Telerik RadFormDecorator for ASP.NET AJAX Q3 2009
-
-RadFormDecorator for ASP.NET AJAX which is part of the Q3 2009 release is fully backwards compatible with its previous version (Q2 2009).
-
-## Telerik RadFormDecorator for ASP.NET AJAX Q2 2009
-
-RadFormDecorator for ASP.NET AJAX which is part of the Q2 2009 release is fully backwards compatible with its previous version (Q1 2009).
-
-## Telerik RadFormDecorator for ASP.NET AJAX Q1 2009
-
-* Total redesign of the skins, which aims for a uniformity of the appearance of all controls in the suite in the cases they are used to build RIAs
-
-* Refactoring of the CSS code to achieve better understanding, easier maintenance and handle problems with global styles
-
-* Changes to the CSS classes, so now all controls for ASP.NET AJAX comply with a common naming convention
-
-## Telerik RadFormDecorator for ASP.NET AJAX Q3 2008
-
-RadFormDecorator is fully compatible with all previous versions of the control.
+---
+title: Overview
+page_title: Changes And Backward Compatibility Overview| RadFormDecorator for ASP.NET AJAX Documentation
+description: Overview
+slug: formdecorator/changes-and-backward-compatibility
+previous_url: controls/formdecorator/changes-and-backward-compatibility
+tags: changes,and,backward,compatibility
+published: True
+position: 0
+---
+
+# Changes And Backward Compatibility Overview
+
+## RadFormDecorator for ASP.NET AJAX
+
+A complete list of all changes can be found on Release History page: [http://www.telerik.com/products/aspnet-ajax/whats-new/release-history.aspx](http://www.telerik.com/products/aspnet-ajax/whats-new/release-history.aspx)
+
+## Telerik RadFormDecorator for ASP.NET AJAX Q2 2010
+
+**Breaking Change:** Before Q2 2010, RadFormDecorator will style checkboxes and radiobuttons even if they have a class property assigned. From Q2 2010 this behavior is changed - RadFormDecorator will style them only if they don't have a class property assigned.
+
+## Telerik RadFormDecorator for ASP.NET AJAX Q1 2010
+
+Buttons' height is increased to 22px. in order to fit and look better when placed next to RadInput or RadComboBox items. The previous button height was 21px. If you are using a custom skin, based on previous version, you should change your main skin's CSS as shown in this sticky forum thread.
+
+## Telerik RadFormDecorator for ASP.NET AJAX Q3 2009
+
+RadFormDecorator for ASP.NET AJAX which is part of the Q3 2009 release is fully backwards compatible with its previous version (Q2 2009).
+
+## Telerik RadFormDecorator for ASP.NET AJAX Q3 2009
+
+RadFormDecorator for ASP.NET AJAX which is part of the Q3 2009 release is fully backwards compatible with its previous version (Q2 2009).
+
+## Telerik RadFormDecorator for ASP.NET AJAX Q2 2009
+
+RadFormDecorator for ASP.NET AJAX which is part of the Q2 2009 release is fully backwards compatible with its previous version (Q1 2009).
+
+## Telerik RadFormDecorator for ASP.NET AJAX Q1 2009
+
+* Total redesign of the skins, which aims for a uniformity of the appearance of all controls in the suite in the cases they are used to build RIAs
+
+* Refactoring of the CSS code to achieve better understanding, easier maintenance and handle problems with global styles
+
+* Changes to the CSS classes, so now all controls for ASP.NET AJAX comply with a common naming convention
+
+## Telerik RadFormDecorator for ASP.NET AJAX Q3 2008
+
+RadFormDecorator is fully compatible with all previous versions of the control.

controls/formdecorator/changes-and-backwards-compatibility/important-changes-decorating-headings-lightweight-radformdecorator.md

@@ -0,0 +1,130 @@
+---
+title: Important Changes Regarding Decorating Headings with Lightweight RadFormDecorator
+page_title: Important Changes Regarding Decorating Headings with Lightweight RadFormDecorator | RadFormDecorator for ASP.NET AJAX Documentation
+description: Important Changes Regarding Decorating Headings with Lightweight RadFormDecorator
+slug: formdecorator/important-changes-decorating-headings-lightweight-radformdecorator
+tags: changes,and,backward,compatibility
+published: True
+position: 1
+---
+
+# Important Changes Regarding Decorating Headings with Lightweight RadFormDecorator
+
+This help article describes the important changes of **RadFormDecorator** in **Lightweight** mode that come with the **Q3 2015** release.
+
+1. [Heading Stylization Cascades Through Individual Classes](#heading-stylization-cascades-through-individual-classes)
+
+1. [Heading Default Font-size Metric is Changed from PX to EM](#heading-default-font-size-metric-is-changed-from-px-to-em)
+
+1. [Heading Tags with Custom Classes will not be Decorated](#heading-tags-with-custom-classes-will-not-be-decorated)
+
+## Heading Stylization Cascades Through Individual Classes
+
+**RadFormDecorator** in **Lightweight** will not add a global **rfdHeading** class to the HTML tag anymore. From this time onwards, the CSS class **rfdHeading** will be added to each heading tag. You can find the rendered markup of decorated H4, H5 and H6 tags prior and after the change in **Example 1** and **Example 2**.
+
+>caption **Example 1**: Heading tags are styled by RadFormDecorator through a global class, added to the HTML tag prior to the Q3 2015 release.
+
+````HTML
+<html class="RadForm RadForm_Default rfdHeading rfdRoundedCorners" xmlns="http://www.w3.org/1999/xhtml">
+...
+<h4>Heading 4</h4>
+<h5>Heading 5</h5>
+<h6>Heading 6</h6>
+...
+</html>
+````
+
+>caption **Example 2**: Heading tags have been styled by RadFormDecorator through an individual class, added to each heading tag since the Q3 2015 release.
+
+````HTML
+<html class="RadForm RadForm_Default rfdRoundedCorners" xmlns="http://www.w3.org/1999/xhtml">
+...
+<h4 class="rfdHeading">Heading 4</h4>
+<h5 class="rfdHeading">Heading 5</h5>
+<h6 class="rfdHeading">Heading 6</h6>
+..
+</html>
+````
+
+This change will affect any custom styles or skin customizations related to heading tags decoration. You should change the old selectors from **Example 3** to match the new ones from **Example 4**.
+
+>caption **Example 3**: RadFormDecorator old selectors for decorating heading tags with the **Default** skin.
+
+````CSS
+.RadForm.rfdHeading h4 {
+ font-size: 14px;
+}
+.RadForm.rfdHeading h5 {
+ font-size: 13px;
+}
+.RadForm.rfdHeading h6 {
+ font-size: 12px;
+}
+
+.RadForm_Default.RadForm.rfdHeading h4, 
+.RadForm_Default.RadForm.rfdHeading h5, 
+.RadForm_Default.RadForm.rfdHeading h6 {
+ color: #333;
+}
+.RadForm_Default.rfdHeading h4, 
+.RadForm_Default.rfdHeading h5, 
+.RadForm_Default.rfdHeading h6 {
+ border-bottom-color: #8a8a8a;
+}
+
+.RadForm.rfdHeading h4, 
+.RadForm.rfdHeading h5, 
+.RadForm.rfdHeading h6 {
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ font-weight: normal;
+ line-height: normal;
+ margin: 0.83333em 0;
+ padding: 0.16667em 0;
+}
+````
+
+>caption **Example 4**: RadFormDecorator new selectors for decorating heading tags with the **Default** skin.
+
+````CSS
+.RadForm h4.rfdHeading {
+ font-size: 1.16667em;
+}
+.RadForm h5.rfdHeading {
+ font-size: 1.08333em;
+}
+.RadForm h6.rfdHeading {
+ font-size: 1em;
+}
+
+RadForm_Default .rfdHeading {
+ color: #333333;
+}
+
+.RadForm_Default .rfdHeading {
+ border-bottom-color: #8a8a8a;
+}
+.RadForm .rfdHeading {
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ font-weight: normal;
+ line-height: normal;
+ margin: 0.83333em 0;
+ padding: 0.16667em 0;
+}
+````
+
+## Heading Default Font-size Metric is Changed from PX to EM
+
+The default font-size metrics of decorated heading tags are changed from px to em (**Example 3** and **Example 4**). This change is required to create an [elastic design for the control]({%slug formdecorator/mobile-support/responsive,-adaptive-and-elastic-capabilities%}). 
+
+## Heading Tags with Custom Classes will not be Decorated
+
+When a custom class is applied to a heading tag it will be perceived as a customly styled element and hence **RadFormDecorator** will skip it from decoration. This behavior also resolves styles overriding issues when **RadFormDecorator** is integrated with other controls from the Telerik UI for ASP.NET AJAX suite. 
+
+## See Also
+
+ * [Changes And Backward Compatibility]({%slug formdecorator/changes-and-backward-compatibility%})
+
+ * [Responsive, Adaptive and Elastic Capabilities]({%slug formdecorator/mobile-support/responsive,-adaptive-and-elastic-capabilities%})
+