Fancybox Terms of use background image removal

[aussiePrestaUser]

Can someone help me figure out how to delete the background on the fancybox popup in terms of use.

 

Its inherited my background image for some reason with the cms and You cant read the first section of terms of use

I cant find where in the CSS I have to modify the code(apart from global css, which for obvious reasons I dont want to change). Is there a work around for this ?

 

Cheers

[eR3Ms]

I've the same problem, I don't see what to do.

 

SomeOne can help us?

 

Thanks, eReMs

[monxu]

I've the same problem..

[PcGuy]

I also have this problem, has anyone found a solution yet?

[Syl77]

Late but I only read the french forum usually.

I modify global.css (line 87) , in "body"

 

 

/* text **************************************************************************************** */
p {padding-bottom:20px}

 

and add background-color :

 

 

/* text **************************************************************************************** */
p {padding-bottom:20px; background-color:#fff}

 

and it's good ; it's white... I had my general background in the fancybox and it was unreadable.

 

For AussiePrestaUser, if you don't want to modify global.css, I have no solution. But that one may help someone else...

 

And excuse my laborious english...

[PcGuy]

Thank you for your reply, it partially helped now only behind the text is white but other parts still have my background image

 

[seno]

I had the same problem. Here is my solution:

 

Global.css

 

/* global RTE fields */

.rte,

.mceContentBody {

text-align: left;

background: #Put Your Color;

Edited December 1, 2012 by seno (see edit history)

[taseaford]

Seno, I can't seem to get your code to work. Can you explain a little more about what's supposed to be happening here? I added it to my global css file but it had no affect.

 

Syl77's fix will work in theory, though for me it was found at line 102 rather than 87. But since this is globally modifying the style of the <p> tag I don't believe this is efficient. If you ever have text that you want to allow the bground color or image to shine through, you'll have to figure something else out. Plus you get the behavior that PcGuy described. It's only modifying the paragraph not <h1-7> tags. In order to address the behavior PcGuy spoke of, you'll need to also modify the title section in global.css. For me it was directly above the text section.

 

My solution removes both of these problems but not without its own set of issues. If you add a block of code in the generic style section (lines 52ff. for me) you can remove the background color without affecting other areas. Thus,

 

/* ************************************************************************************************
 generic style
************************************************************************************************ */
body{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
/*background:#fff;*/background-image:url('../img/BlackToGreyToBlackGradient.svg');
}
body#cms{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
background-image:url('../img/BlackToGreyToBlackGradient.svg')}

 

becomes

 

/* ************************************************************************************************
 generic style
************************************************************************************************ */
body{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
/*background:#fff;*/background-image:url('../img/BlackToGreyToBlackGradient.svg');
}
body#cms{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
background-image:url('../img/BlackToGreyToBlackGradient.svg')}

body.cmsFancyBox{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
background-image:none;
background-color:#fff;}

 

You can see that this works by going to your order carriers page and clicking on your terms of service link (if enabled). Then inspect with Firebug and change the body class of the page in the iframe inside of the fancybox to "cmsFancyBox". By default, class is left blank.

 

Using this technique, any instance with a class of "cmsFancyBox" will have a clean background.

 

However, I do not know how to get the body class to be "cmsFancyBox" by default. Any suggestions would be appreciated.

 

Thanks for your help!

 

I am running PS 1.5.1.0 the default theme customized.

Edited February 5, 2013 by taseaford (see edit history)

[imugur]

Seno, I can't seem to get your code to work. Can you explain a little more about what's supposed to be happening here? I added it to my global css file but it had no affect.

 

Syl77's fix will work in theory, though for me it was found at line 102 rather than 87. But since this is globally modifying the style of the <p> tag I don't believe this is efficient. If you ever have text that you want to allow the bground color or image to shine through, you'll have to figure something else out. Plus you get the behavior that PcGuy described. It's only modifying the paragraph not <h1-7> tags. In order to address the behavior PcGuy spoke of, you'll need to also modify the title section in global.css. For me it was directly above the text section.

 

My solution removes both of these problems but not without its own set of issues. If you add a block of code in the generic style section (lines 52ff. for me) you can remove the background color without affecting other areas. Thus,

 

/* ************************************************************************************************
  generic style
************************************************************************************************ */
body{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
/*background:#fff;*/background-image:url('../img/BlackToGreyToBlackGradient.svg');
}
body#cms{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
background-image:url('../img/BlackToGreyToBlackGradient.svg')}

becomes

 

/* ************************************************************************************************
  generic style
************************************************************************************************ */
body{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
/*background:#fff;*/background-image:url('../img/BlackToGreyToBlackGradient.svg');
}
body#cms{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
background-image:url('../img/BlackToGreyToBlackGradient.svg')}

body.cmsFancyBox{
font:normal 11px/14px Arial, Verdana, sans-serif;
color:#222;
background-image:none;
background-color:#fff;}

You can see that this works by going to your order carriers page and clicking on your terms of service link (if enabled). Then inspect with Firebug and change the body class of the page in the iframe inside of the fancybox to "cmsFancyBox". By default, class is left blank.

 

Using this technique, any instance with a class of "cmsFancyBox" will have a clean background.

 

However, I do not know how to get the body class to be "cmsFancyBox" by default. Any suggestions would be appreciated.

 

Thanks for your help!

 

I am running PS 1.5.1.0 the default theme customized.

 

has anyone found a clean solution for this? in the fancybox I am getting the theme background image by default...