Why isn't the zoom effect rounding corners on my website?

Store Design
, ,
1

image.jpg
image.jpg3024×4032 2.49 MB

image.jpg
image.jpg3024×4032 2.19 MB

Hi everyone!

i’m having an issue with the zoom effect on my website. I’ve recently made a more rounded theme (rounding the edges of most objects), but when I made this change, it didn’t apply when hovering over collection banners, images etc (see attached)

does anyone know how to fix this?

website URL:

www.redosports.com.au

2

Add this CSS at the bottom of Online Store->Theme->Edit code->Assets->theme.css

.promotion-block-list .promotion-block{
   border-radius: 10px;
}

If you find our reply helpful, please hit Like and Mark it as a Solution.

An award-winning North American Shopify Development Agency That Delivers Powerful Results, Innovation, and Secure Digital Transformation.

3

Hello @MattyCeravolo

It’s GemPages support team and glad to support you today.

I would like to give you a solution to support you.

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid theme file.

  3. Paste the below code before :

Hope my solution can work and support you!

Kind & Best regards!

GemPages Support Team.

4

@MattyCeravolo

Add this to the end of Theme Editor > assets > theme.css file

.promotion-block.image-zoom {
    border-radius: 10px !important;
}

I hope this solution is useful