Kama skin and dialog background color

In a pretty standard setup I'm using the Kama skin and have changed uiColor to blue. The problem is that this looks pretty bad in the dialogs:

At first I thought I could change this with a style in the header of the page, by setting background of .cke_dialog_contents to something else. This turned out not to work, because kama.js overwrites (with !important) this when the dialog is shown. (var cssProperties = "background-color: $color !important;";)

Any ideas as to how to change the background color of the dialog, without changing kama.js? (I prefer not make changes to CKEditor files!)

Attachments:

Smiley dialog

Fri, 02/04/2011 - 18:50

railing

Joined: 31/01/2011

Posts: 5

Re: Kama skin and dialog background color

Hello,
I've got the same problem and now I've got the answer. 8-)

The problem is caused by the way CKEditor handles a skin. In the skin-folder you find the unminimized file skin.js. This file is normally part of the minimized core-script. To override the behavior of CKEditor's core-script you just have to load the skin.js-file additionally after ckeditor.js. Now you can change the script of skin.js without the need to change the core-script.

In the skin.js-file you find this part of code:

var cssSelectors =
[
  cssId + " .cke_wrapper",
  cssId + "_dialog .cke_dialog_contents",
  cssId + "_dialog a.cke_dialog_tab",
  cssId + "_dialog .cke_dialog_footer"
].join( ',' );
var cssProperties = "background-color: $color !important;";

Comment out the part you don't like (be careful with the commas) and CKEditor does not override its style for the colour anymore. Now you can handle the colour in the dialog.css-file.

Good luck!
railing

Sun, 02/06/2011 - 14:09

reonekot

Joined: 02/05/2010

Posts: 6

Re: Kama skin and dialog background color

Thanks for the advice. It was actually perfect timing, as I haven't had time to look more into it since anyway. I ended up copying the skin.js and commenting out a few lines and settings those styles myself else where and it looks okay now finally.