DAWN THEME: Transparent/PNG images displaying grey border.

[TOE_BEE]

When in the collection page I currently see a grey border around my products when they should just blend to the background of the theme. The theme I'm using Dawn. 

The theme is built in shopify's testing environment so I can make all aesthetic changes needed without affecting my current products/website. I'm not sure if this URL can be viewed but here it is - https://tobys-test-store-dac.myshopify.com 

I know there's a few articles around this however all attempts I've tried do not result in the backgrounds being transparent/ removes the grey background for product shots. 

[Moeed]

Hey @TOE_BEE 

Your website is password protected, can you share your website password as well?

Best Regards,

Moeed

[BSS-TekLabs]

Can you share password @TOE_BEE 

[TOE_BEE]

The store password is goltea

@BSS-TekLabs @Moeed 

Thanks for the speedy response

[Moeed · Accepted solution]

Hey @TOE_BEE 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.media.media--transparent.media--hover-effect {
    background: white !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[TOE_BEE]

This worked, thank you Moeed

[Moeed]

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

[BSS-TekLabs]

- Here is the solution for you @TOE_BEE 
- Please follow these steps:

 

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.card__inner.gradient {
    background: transparent !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.