How can I make image borders rounded in the Dawn theme?

Store Design
,
1

Hey guys,

I would like to leave the borde rounded in the following images:

(3) - image with text in product descriptions

chrome-capture-2023-4-31 (2).png
chrome-capture-2023-4-31 (2).png1295×640 515 KB

chrome-capture-2023-4-31.png
chrome-capture-2023-4-31.png1295×640 425 KB

(2) - images of products from the selected collection (in this case, I use the pagefly app and select a certain collection from my store)

chrome-capture-2023-4-31 (1).png
chrome-capture-2023-4-31 (1).png1295×640 548 KB

(1)- rounds the bottom border of featured collection product images.

chrome-capture-2023-4-31 (2).png
chrome-capture-2023-4-31 (2).png1295×640 515 KB

my website is: www.smartcasashop.com.br

2

Hey @Danielpochapski

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 tag.
{% if template == 'index' %}

{% endif %}

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

Best Regards,
Moeed

3

@Moeed thanks for your response!

Your solution worked perfectly. However, I have another problem now. On the rounded edges, a gray color appears (theme default). However, even if I set the presentation background to white, it insists on appearing. How do I make the background that appears in the corners turn white?

chrome-capture-2023-4-31 (7).png
chrome-capture-2023-4-31 (7).png1295×640 544 KB

4

Hi, @Danielpochapski

Greetings from the Store Watchers Support Team! Happy to help you today.

  1. Go to online store > theme > edit code > assets > base.css(file) and Paste the below code at the bottom of the file → Save
.image-with-text__media{
    border-radius:15px !important;
}
.card--card .card__inner .card__media {
    border-radius: 15px !important;
}
.slideshow__media{
    background-color: white !important;
}

After applying the above CSS code , it will show like the following screenshot:

Screenshot_26.png
Screenshot_26.png1351×586 327 KB

Screenshot_27.png
Screenshot_27.png1354×584 187 KB

Screenshot_28.png
Screenshot_28.png1289×469 445 KB

Let me know If need further assistance

Regards,

Store Watchers Support Team

5

Hi @Danielpochapski

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

About this problem maybe your theme is having a default code border-radius: 0 to solve this problem you can contact our 24/7 live chat support to discuss more and fix it.

Hope you find my answer helpful!

Best regards,

Richard | PageFly