Colour of Display modal popup upon 'Add to cart'

[Brockney]

Hi there,

My site has a black background and the modal popup has a white background and white text.

Do I change the colour settings in Virtuemart or in Joomla?

Here is a screenshot with the pop up and another where I have highlighted the text with the mouse.

Help is appreciated

[Brockney]

Sorry, I should have mentioned my VM version it is 3.0.18 and I have Joomla 3.6.4

The site is www.emporiumvape.com

Cheers

[Jörgen]

Hello

This is a CSS problem. You could try to add something like this

Code Select Expand

#fancybox-content a,
#fancybox-content .h4 {
  color: black;
}

regards

Jörgen @ Kreativ Fotografi

[Studio 42]

Or change the modal background

[Brockney]

Thank you so much, I have learned something here (although not yet solved the problem)

I found by right clicking on the live site and viewing the page source I could actually change the text colour from their but it doesn't save it of course. Gave me a bit of extra confidence and understanding though!

In the back end of the site I could not find the css file or where to change the modal background.

I looked here and checked every css file but couldn't find it. Where would it be?

[jenkinhill]

You can use Firebug to identify any file.  http://forum.virtuemart.net/index.php?topic=116620.0

But all you need to do is to apply a css override, ususally to your Joomla template.css

[Brockney]

Firebug is brilliant, thanks Jenkinhill!

I have found the code with it and did an edit to get it how I want it. I just can't find the code in the back end to make it a permanent part of the site. Is there anything in Firebug that can give me a hint?

[Ghost]

Add #fancybox-content{background:#000} to your custom CSS file. Do note this will affect all Fancybox windows.

[Brockney]

Thanks Ghost.... this will be ideal but I can't find any css file related to the fancybox (I have checked the code for all of these in the screenshot)

I don't mind where and how I edit it (and will probable laugh at myself when I do!)

Thank you all so much for helping me with this

[Jörgen]

Hello

You don´t have to edit and actually change any CSS. You have to add this in the file that is loaded last. Usually the template.css or some other te,plate assigned file. Does Yoy template have any setting in the Control panel for this ?
If it hasn´t add it to the end of template.css and remember to update this You update Your template

regards

Jörgen @ Kreativ Fotografi

[jenkinhill]

The style Ghost suggested is an override so it can be added to any .css file as long as it loads after jquery.fancybox-1.3.4.css

It does look like your template loads a lot of custom css which is usually configurable in the template style editor, but if that is beyond you then simply add it to the end of the file at /templates/diverseshop/css/template.css but it will make the background of all fancybox popups black. So test!

[Brockney]

Guys, I'm really learning a lot from this and thank you, I have delved into parts of the structure that are completely new to me and am learning a little bit as I go along too so thank you 

I have added the code to the template.css as suggested and it worked! Very happy!

Just one last bit I am still trying to figure out, where the code is for the Billing Address Information. Had a good look through using Firebug and found some of the color coding but again cannot find it in the back end of the site

[GJC Web Design]

it is shown in Firebug - that's what it is for

but as mentioned already .. css works anywhere.. Cascading Style Sheets!

put it in the last -- will always work

put !important after the rule - will always work . (as long as there isn't another !important later) - if so just define your target more precisely

why not look up basic css in w3 schools or something - this forum isn't for basic web skills.. it is for VM

[Brockney]

Many thanks, great suggestion and I appreciate your help and support