RadControls for ASP.NET AJAX
In the Q2 2008 release we have introduced a new editor property named DialogCssProperty which is useful in scenarios when a custom skin is used. It allows you to include your custom skin CSS in the editor dialogs. Please, review bellow how to achieve the desired behavior:
Set the EnableEmbeddedSkins property to false
Place the editor's Skins folder within your web application - the Skins folder can be found in the RadControls for ASP.NET AJAX installation folder.
Choose the desired skin and set the editor's Skin property to point to it e.g. Skin = "Default"
Add manually to the page's head the following CSS files:
CopyXML
<link href="Skins/Window.css" rel="stylesheet" type="text/css" />
<link href="Skins/Editor.css" rel="stylesheet" type="text/css" />
<link href="Skins/<CurrentSkin>/Window.<CurrentSkin>.css" rel="stylesheet" type="text/css" />
<link href="Skins/<CurrentSkin>/Editor.<CurrentSkin>.css" rel="stylesheet" type="text/css" />
Create new CSS file e.g. DialogCSS.css and put in it references to the following CSS files which will style the different Telerik controls in the editor dialogs:
CopyXML
@import url('../ToolBar.css');
@import url('../FormDecorator.css');
@import url('../TabStrip.css');
@import url('../Editor.css');
@import url('../TreeView.css');
@import url('../Splitter.css');
@import url('../Slider.css');
@import url('../Upload.css');
@import url('../Window.css');
@import url('../Grid.css');
@import url('../Widgets.css');
@import url('../FileExplorer.css');
@import url('../Menu.css');
@import url("Ajax.<CurrentSkin>.css");
@import url("ColorPicker.<CurrentSkin>.css");
@import url("ComboBox.<CurrentSkin>.css");
@import url("Dock.<CurrentSkin>.css");
@import url("FormDecorator.<CurrentSkin>.css");
@import url("Grid.<CurrentSkin>.css");
@import url("Input.<CurrentSkin>.css");
@import url("Menu.<CurrentSkin>.css");
@import url("PanelBar.<CurrentSkin>.css");
@import url("Rotator.<CurrentSkin>.css");
@import url("Slider.<CurrentSkin>.css");
@import url("Spell.<CurrentSkin>.css");
@import url("Splitter.<CurrentSkin>.css");
@import url("TabStrip.<CurrentSkin>.css");
@import url("ToolBar.<CurrentSkin>.css");
@import url("TreeView.<CurrentSkin>.css");
@import url("Upload.<CurrentSkin>.css");
@import url("Window.<CurrentSkin>.css");
@import url("Widgets.<CurrentSkin>.css");
Set the editor's DialogsCssFile property to point to the DialogCSS.css e.g. DialogsCssFile="~/Skins/Default/DialogCSS.css"