Opened 7 years ago

Closed 5 years ago

Last modified 5 years ago

#5047 closed New Feature (invalid)

Background color in CKEditor 3.1 normal/fullscreen

Reported by: bestis Owned by:
Priority: Normal Milestone:
Component: General Version: 3.1
Keywords: Cc:

Description (last modified by fredck)

There is new contents.css which tells it to be white. Changing it doesn't help when using v2 style, because it has editor.css:

.cke_contents{border:solid 1px #696969;background-color:white;}

Changing that to transparent fixes the problem.

But then when Maximized to fullscreen transparent shows underlaying page and there isn't any way (that I know of) chancing the background and maybe other styles according to are we in normal or fullscreen. There should be some class to use differentiate the mode.

Change History (7)

comment:1 Changed 7 years ago by fredck

  • Component changed from Core : Styles to General
  • Description modified (diff)
  • Keywords background transparency fullscreen v2 color removed
  • Type changed from Bug to New Feature

comment:2 Changed 7 years ago by bestis

  • Milestone set to CKEditor 3.5

Oh C'mon please fix this. This is a big show stopper for us. So I changed milestone to 3.5 if something would happen to this.

comment:3 Changed 7 years ago by fredck

  • Milestone CKEditor 3.5 deleted

Maybe you can provide us a patch for this one?

comment:4 Changed 6 years ago by bestis

If I would know how to make it and would be familiar enough and would know enough js then maybe. But ok, why there is then contents.css which says:

	/* Remove the background color to make it transparent */
	background-color: #fff;

If removing that doesn't make it transparent? As those skins says that it's white.

But ok, after now there are maximized which can be used:

.cke_skin_v2 .cke_contents{border:solid 1px #696969;background-color:transparent;}
.cke_maximized {background-color: white;}

This makes thing much nicer and there is a way to change background color accordingly are we in fullscreen or not. As to original problem, there's still that contents.css text that isn't true.

Now my problem is how could I define that .cke_maximized color in some other css file which I could generate, as it would be nice if the background color would in fullscreen case be the "user configured background color", which I cannot declare statically in editor.css. Didn't manage to override those editor.css settings in contentCss file. But one could think that as a different problem.

comment:5 Changed 5 years ago by j.swiderski

  • Resolution set to invalid
  • Status changed from new to closed

Changing the background-color works. One must not forget about refreshing the cache afterwards.

As for transparent - it also works but there is a catch. Each skin has its specific rules. If you make body transparent "it will take" the color of it's parent in DOM tree. In case of v2 skin, parent element which also has color is element with class .cke_contents

cke_skin_v2 .cke_contents #fff
body with #fff

As for kama skin there are two parent elements which have color.

cke_wrapper with #D9D9D9
cke_skin_kama .cke_contents iframe with #fff
body with #fff

Agreed that this may be confusing but IMO it has more to do with not agreeing on skin design than with buggy behavior.

Closing the ticket.

comment:6 Changed 5 years ago by bestis

Yes, there's a catch!

Like I said after that changeset 3611 it can be at least fixed by just editing .css files, so yes the bug I originally reported is fixed in changeset 3611.

But I still think that there's problem with the Skin(s) but that kind of another issue.

As if the contents.css says something thats not true. As if issue is not to agree with skin design, why contents.css even has that line if it doesn't change anything and it's decided by your skin design?

I see couple of ways to solve this, make that line in contents.css work as advertised or remove it. But that's not so big issue for me that I want to create ticket out of it. Of course I would like that I would just need to remove that line from contents.css to get my editor transparent (and in fullscreen white or something else, as then it can't be transparent). Before that I just need to remember to patch v2 skins .css file.

comment:7 Changed 5 years ago by j.swiderski

I have made a mistake writing in may last post

"it will take" - notice the " marks it has more to do with not agreeing on skin design

Let's say it's true but it gave a false impression you have described below:

As if the contents.css says something thats not true.
if it doesn't change anything and it's decided by your skin design?

It does say true. It changes the editor's body color to transparent but the problem is that other elements that are placed behind this body are not transparent.

E.g. Window glass is transparent but if you put red board behind it, it will no longer look transparent but red. This is what is happening here.

I see couple of ways to solve this, make that line in contents.css work as advertised or remove it.

We can't use one rule on elements it was not assigned to. Once again this works and will not be changed - perhaps adding few comment lines warning about elements behind editor's body would solve the issue here.

Last edited 5 years ago by j.swiderski (previous) (diff)
Note: See TracTickets for help on using tickets.
© 2003 – 2016 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy