How to change product Lightbox background colour and text SS 7.1

Hi there I hoping you can help me. I'm working on a website for a client which is due to launch on Friday the site is complete but I have one issue. I would like to change the Product Quick View light box background colour from black to white. I have looked through the colour options and I can't see where I could do this. I have searched the square space forum for the last 2days but have had no luck, I was able to change the background colour  with some css code but the text and the form fields are still white. How can I change the text colour and all the other elements  to black. Please can you help me?

I'm having the same problem! So weird it's not an option in the color styles!!

Can you share link to product in screenshot? We can check easier

Hi @tuanphan. I have the same question. I can change the background color to white, and the button color, but the white paragraph and value text needs to be changed to black, and the black button text needs to be changed to white (button will be maroon). 

The site is https://afikomen-judaica.squarespace.com/shop, PW is Judaica. 

I appreciate your help!!

On 2/2/2021 at 5:29 AM, RicaDesigns said:

Hi @tuanphan. I have the same question. I can change the background color to white, and the button color, but the white paragraph and value text needs to be changed to black, and the black button text needs to be changed to white (button will be maroon). 

The site is https://afikomen-judaica.squarespace.com/shop, PW is Judaica. 

I appreciate your help!!

Add to Design > Custom CSS

/* Quick view lighbox */
div.sqs-product-quick-view-content .ProductItem-details-checkout * {
    color: black !important;
}

Thank you! That worked perfectly. 

Hi,

Actually it's working perfectly for products that have a quantity, but the gift card value button has overlapping text now. Do you have any idea what's happening? 

Thanks!

6 hours ago, RicaDesigns said:

Hi,

Actually it's working perfectly for products that have a quantity, but the gift card value button has overlapping text now. Do you have any idea what's happening? 

Thanks!

 

Add to Design > Custom CSS

div.sqs-product-quick-view-content .ProductItem-details-checkout * {
    color: black !important;
}
.product-details .variant-option select {
    color: transparent !important;
}

Hi,

I was able to change the quick view background color with this. 🙂 incase it helps someone

.sqs-product-quick-view-content {background:purple}

the css only changes the description, is there a way to change the heading too?

Quick view lighbox */
div.sqs-product-quick-view-content .ProductItem-details-checkout * {
    color: #696969!important;

On 8/23/2021 at 6:31 PM, Madscrow said:

the css only changes the description, is there a way to change the heading too?

Quick view lighbox */
div.sqs-product-quick-view-content .ProductItem-details-checkout * {
    color: #696969!important;

Hi, Do you still need help?

Hey there,
it seems, that the color scheme is based on “dark 1”. One can edit stuff there but it will interfere with the design of other blocks that use “dark 1”.
It would be awesome to simply set the color scheme to the preferred one. Is this possible? It would make much more sense than changing every detail on it's own per individual code.
Thanks already for your help 🙂