Implementation Overview

Create a skin:

Access the ManageAssets project and navigate to the package com.adobe.solutions.cmg.manage.skins (CorrespondenceManagementSolutionTemplate\ManageAssets\src\com\adobe\solutions\cmg\manage\skins).
Create an MXML Skin (such as CustomTextEditorSkin.mxml) for the host component com.adobe.solutions.acm.authoring.presentation.TextEditor by copying an existing skin such as com.adobe.solutions.acm.authoring.skins.TextEditorSkin.

Make the desired changes in the MXML skin. For example, you can increase the height of the description input making it multiline. Change the descrptionDesplay to TextArea and increase its height from:

<s:TextInput id="descriptionDisplay"  enabled="true" enabled.View="false" width="205" height="24" />

To:

<s:TextArea id="descriptionDisplay"  enabled="true" enabled.View="false" width="205" height="54" />

Similarly, to change the dialog footer color, update the following code from:

<!-- footer background --> 
    <s:Rect bottom="1" left="1" right="1" height="{footerBar.height}" > 
         <s:fill > 
             <s:LinearGradient rotation="90" > 
                 <s:GradientEntry color="0xe6e6e6"  /> 
                 <s:GradientEntry color="0xe0e0e0"  /> 
             </s:LinearGradient> 
         </s:fill> 
    </s:Rect> 
    <s:Rect bottom="{footerBar.height-1}" left="1" right="1" height="1" > 
         <s:fill> 
             <s:SolidColor color="0xd1d1d1"  /> 
         </s:fill> 
</s:Rect>

To:

<!-- footer background --> 
    <s:Rect bottom="1" left="1" right="1" height="{footerBar.height}" > 
        <s:fill > 
            <s:LinearGradient rotation="90" > 
                <s:GradientEntry color="0x3BB9FF"  /> 
                <s:GradientEntry color="0xe0e0e0"  /> 
            </s:LinearGradient> 
        </s:fill> 
    </s:Rect> 
    <s:Rect bottom="{footerBar.height-1}" left="1" right="1" height="1" > 
        <s:fill> 
            <s:SolidColor color="0x3BB9FF"  /> 
        </s:fill> 
</s:Rect>

Create a CSS file to use the above skin class, and add the CSS to the main project file index.mxml. For example:

/* CSS file */ 
@namespace s "library://ns.adobe.com/flex/spark"; 
@namespace mx "library://ns.adobe.com/flex/mx"; 
@namespace presentation "com.adobe.solutions.acm.authoring.presentation.*"; 
 
presentation|TextEditor 
{ 
    backgroundGradientStartColor: #FFFFFF; 
    backgroundGradientEndColor: #FFFFFF; 
    outerBorderColor: #000000; 
    outerBorderAlpha: .33; 
    skinClass: ClassReference("com.adobe.solutions.cmg.manage.skins.CustomTextEditorSkin"); 
    cornerRadius: 2; 
}

Update index.mxml file to include this custom CSS file (include after including all other CSS files).
```
<fx:Style source="/CSS/custom_styles.css"/>
```
Rebuild and Redeploy. For information on rebuilding and redeploying, see Building and deploying the Solution Template.