CSS changes for shop and buttons

Hello. I am looking for 3 CSS changes to the theme.

1. Stop footer text appearing lighter then usual (footer text should be WHITE)

2. Add 1px border around the product image / price / add to cart button on the shop page as well as the related products on the single product page (see screenshot below for example)

3. Change ALL buttons on the website including Add to Cart button on widget / Single product page Add to Cart button / View Cart / Update Cart / Contact Form 7 send a message / Large Color Default Button to BROWN for normal state and BLUE for hover.

Thank you! Great theme and support.

Hello,

1/ Footer text – the main text is white. If you want white icons, use this CSS:

.footer-container.color-scheme-light ul li a {
    color: #ffffff;
}

If you need copyrights to be white take this CSS:

.copyrights-wrapper{
color:#ffffff;
}

2/ Product grid border:

.product-grid-item > div {
border 1px solid #000000;
}

If any code does not work, please provide admin access.

As for the buttons. Please navigate to Theme Settings > Styles and colors > and set the color http://prntscr.com/j7ipy5 if any buttons remain with wrong color, please provide link to the pages, I will provide CSS.

Best Regards

1. Thank you code worked.

2. Code did not work. I have provided admin access below.

3. I have provided some more information on which buttons

Did you receive the login credentials?

Hello,

I have corrected code, now you have grid border.

As for buttons. You have custom CSS in Theme Settings > Custom CSS determining button colors to be #49382d now you want #5FBDAD . Determine please the buttons color you want and set them in Theme Settings > Styles and colors. Now you shopping buttons are #5FBDAD

I have hidden all CSS for button background with comments. As soon as you make decisions on color, you will delete or edit this code if necessary.

Best Regards

Thank you for the quick response. The border is exactly how I wanted it.

However there appears to be an issue with the ‘Related Products’ as the spacing is now incorrect. I have attached a screenshot below of how it was before vs after the additional CSS code. Is there a way to space them correctly with 3 columns and the border?

Additionally is it possible to change the border color when you hover over the area?

Same issue on the front page using the Products Carousel

So I only require it on the shop page (with 4 columns) and the related products (3 columns)

NOT the Products Carousel on the front page.

Thank you for the detailed assistance!

Hello,

Check now.

Enter Custom CSS and find this code http://prntscr.com/j7savw put the color you want to see on hover instead of “red”.

Best Regards

[Author]

Posts