How can I create round corners on images in the Prestige theme?

[CuteGeek]

Hi,

I would like to get round corners on all images, except for the slideshow images and full side-to-side images.
I'm using the prestige theme.

Can anyone help? 

www.cutegeek.dk (Code: 1234)

[dmwwebartisan]

@CuteGeek 

Please add the following code at the bottom of your assets/theme.css file.

.Image--lazyLoaded.Image--fadeIn {border-radius: 7px;overflow: hidden;border: 1px solid #dddddd;}
@media screen and (min-width: 1008px){
.Product__Gallery--stack .Product__Slideshow .Image--lazyLoaded.Image--fadeIn {
border-radius: 7px;
overflow: hidden;
border: 1px solid #dddddd;
}
}

Hope this helps.

Thanks!

[CuteGeek]

@dmwwebartisan Thanks, it works on most of the images.
Now it's only the collection images that also needs to be rounded - do you know how? 🙂

It's these:

[dmwwebartisan · Accepted solution]

@CuteGeek 

Please add the following code at the bottom of your assets/theme.css file.

.CollectionItem__ImageWrapper {
    border-radius: 25px ;
    overflow: hidden;
}

Hope this helps.

Thanks!

[CuteGeek]

@dmwwebartisan Thanks, I removed "Image" from _ImageWrapper, and then it worked 🙂 

[Londan]

@dmwwebartisan 

Could you help me with an update to this code for 2024. I am using the prestige theme as well but doesnt round the corners when I load into the assets/theme.css file

thanks a lot 🙂

[dmwwebartisan]

@CuteGeek 

Any other problem Let me know.

Thanks!