You need to be logged in to post in the forum - Log In

An active JCE Pro Subscription is required to post in the forum - Buy a Subscription

Support is currently Offline

Official support hours
Monday to Friday
09:00 - 17:00 Europe/London (BST)

Please create a new Ticket and we will get back to you as soon as we can.

#101288 Different toolbar-icon-size in JCE27xx and JCE28xx

Posted in ‘Editor’
This is a public ticket

Everybody will be able to see its contents. Do not include usernames, passwords or any other sensitive information.

Latest post by HGH on Monday, 16 December 2019 14:52 GMT

HGH
THe toolbar-icon-size is different in JCE27xx and JCE28xx.
See pics.

May be it has something to do with this :https://www.joomlacontenteditor.net/support/forum/98545

Attachments

Ryan
Yes, the icons are slightly bigger in JCE 2.8.x

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

HGH
Why that?
In JCE2.7.xx it was good with the solution you gave me with my one ccs-override.
In 2.8.xx it doesn't seem to work anymore.

How can I get back the smaller icon-size in 2.8.xx.
I don't want the toolbar been blowing up as much as necessary.

Ryan
Try this:

.defaultSkin .mceButton {
    min-width: 28px;
    min-height: 28px;
    padding: 2px;
}

.defaultSkin .mceListBox .mceText,
.defaultSkin .mceListBox .mceOpen,
.defaultSkin .mceSplitButton button,
.defaultSkin .mceSplitButton .mceOpen {
    height: 28px;
}

.defaultSkin .mceSplitButton button {
    width: 28px;
}

.defaultSkin .mceListBox .mceOpen:after,
.defaultSkin .mceSplitButton .mceOpen:after {
    line-height: 28px;
}

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

HGH
Sorry ryan,
I coun't get it to run.
I've created a file
editor.css
in path
/media/jce
and put in that code, but nothing works.

Ryan
There has been a change to some of the class names, try:

.mceDefaultSkin .mceButton {
    min-width: 28px;
    min-height: 28px;
    padding: 2px;
}

.mceDefaultSkin .mceListBox .mceText,
.mceDefaultSkin .mceListBox .mceOpen,
.mceDefaultSkin .mceSplitButton button,
.mceDefaultSkin .mceSplitButton .mceOpen {
    height: 28px;
}

.mceDefaultSkin .mceSplitButton button {
    width: 28px;
}

.mceDefaultSkin .mceListBox .mceOpen:after,
.mceDefaultSkin .mceSplitButton .mceOpen:after {
    line-height: 28px;
}

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

Ryan
I have fixed this on your site. The final css looks like this:

.mceDefaultSkin .mceToolbar .mceButton {
    min-width: 28px;
    min-height: 28px;
    padding: 2px;
}

.mceDefaultSkin .mceToolbar .mceListBox .mceText,
.mceDefaultSkin .mceToolbar .mceListBox .mceOpen,
.mceDefaultSkin .mceToolbar .mceSplitButton button,
.mceDefaultSkin .mceToolbar .mceSplitButton .mceOpen {
    height: 28px;
}

.mceDefaultSkin .mceToolbar .mceSplitButton .mceText {
    width: 28px;
}

.mceDefaultSkin .mceToolbar .mceListBox .mceOpen:after,
.mceDefaultSkin .mceToolbar .mceSplitButton .mceOpen:after {
    line-height: 28px;
}

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

HGH
Hi Ryan,

thanks for your investigation, but there are further probs.

The editor.css is always fetched after the default css-file.

How can I change the sequenz?

Attachments

Ryan
The loading sequence of the files cannot be changed.

I have fixed this issue on your site, with the css in my previous post. This uses more precise css selectors to override the exiting styles, regardless of the loading order of the files.

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.

HGH
Hi Ryan and others here, after a long time of experience, I found out my settings. This works, and for me it is perfect. The changes are made in a file editors.css. That is in the \media\jce\ folder of the joomla folder-tree.

/* HGH 191004
 * making the editor-icons smaller
 * see: https://www.joomlacontenteditor.net/support/forum/101288
*/
.mceDefaultSkin .mceToolbar .mceButton {
    min-width: 15px;
    min-height: 15px;
    padding: 2px;
}

.mceDefaultSkin .mceToolbar .mceListBox .mceText,
.mceDefaultSkin .mceToolbar .mceListBox .mceOpen,
.mceDefaultSkin .mceToolbar .mceSplitButton button,
.mceDefaultSkin .mceToolbar .mceSplitButton .mceOpen {
    height: 25px;
}

.mceDefaultSkin .mceToolbar .mceSplitButton .mceText {
    width: 15px;
}

.mceDefaultSkin .mceToolbar .mceListBox .mceOpen:after,
.mceDefaultSkin .mceToolbar .mceSplitButton .mceOpen:after {
    line-height: 15px;
}

.mceDefaultSkin button,
.mceDefaultSkin input,
.mceDefaultSkin label,
.mceDefaultSkin select {
    font-size: 10px;
}

.mceDefaultSkin .mceAction,
.mceDefaultSkin .mceButton .mceIcon {
    display: inline-block;
    min-width: 17px;
    height: 17px;
    line-height: 20px;
}