REQ: Tips on CSS styling of editor buttons (img, samples)

[mrmut]

Hello,

I have created a custom editor menu for my needs, however the method was quite quick'n dirty, so I would like to do it properly.

The menu I made yesterday is attached.

Where is the main CSS for styling classes? I really digged in hard to format the "Format" selector. It is nasty how they designed it.

Also, when I turn on certain options, like full screen, or blocks, the buttons are grayed out. I was searching for a way to style them properly, but couldn't do it well.

Any hep appreciated, CSS code for formatting is here:

To CSS format "Format" dropdown list (the same is limited by options in "config.js"), in "editor.css":

Code:

.cke_skin_getsimple .cke_format_panel
{
    height: 116px;
    width: 150px;
}

and

.cke_skin_getsimple .cke_rcombo a,.cke_skin_getsimple .cke_rcombo a:active,.cke_skin_getsimple .cke_rcombo a:hover
{
border:1px solid #ccc;
background:#eee;
color:#333;
float: left;
height: 22px;
padding: 2px;
/* edited part */ margin:2px 1px 0px -8px !important;
}

Custom menu (in "edit.php"):

elseif ($EDTOOL == 'custom') { $toolbar = "['Bold', 'Italic', 'Underline', 'NumberedList', 'BulletedList', 'Format', 'Link', 'Unlink', 'Image', 'RemoveFormat', 'Source']";

[mrmut]

Also, when I turn on certain options, like full screen, or blocks, the buttons are grayed out. I was searching for a way to style them properly, but couldn't do it well.

Got this part. Icons set is grayed out!

Does anyone have icon set that is not grayed?

I have downloaded FCK default icon sets, but they are ugly.

***

I have attached my quick'n ditry icon solution.