By using WCM, all the stylesheets of each site can be managed online easily. You do not need to access to the file system to modify and wait for the server restarted. About the structure, each site has its own CSS folder, this folder can contain one or more CSS files. These CSS files have the data, and the priority. If they have the same CSS definition, the bigger priority will be applied. You also can disable some of them to make sure the disabled style sill not to be applied in to the site.
For example: By default, a WCM demo package has two sites: ACME and Classic. The Classic site has a CSS folder which contains a CSS file called DefaultStylesheet. Most of the stylesheets of this site are defined within this stylesheet. Moreover, the ACME site has two CSS files called BlueStylesheet and GreenStylesheet. The blue one is enabled and the green one is disabled by default. All you need to test is to disable the blue one (by editing it and setting Available equals false) and enable the green one. Now, back to the homepage and you will see the magic.
Note
Remember the cache and refresh the browser first if you do not see any changes. Normally, this is the main reason why the new style is not applied.
Basically, if you want to add a rich text area into your dialogs, you can use addRichtextField method. However, sometimes you want to add the rich text editor manually. So, first, you need to use addTextAreaField method and some additionl javascripts like the below:
<%
String[] fieldDescription = ["jcrPath=/node/exo:description"] ;
uicomponent.addTextAreaField("description", fieldDescription)
%>
<script>
var instances = CKEDITOR.instances['description'];
if (instances) instances.destroy(true);
CKEDITOR.replace('description', {
toolbar : 'CompleteWCM',
uiColor : '#9AB8F3'
});
</script>
