Improve size Badges and texts on mobile

Store Design
, , , ,
1

Hi,
For some reason my badges and text look very off on mobile (product page). Can anyone help make the icons a tiny bit bigger and have more space for the text so that it will be broad and nice like the desktop version ?

I am referring to the gray trust badges not the payment methods

26eacc-2.myshopify.com
Password: 123456

Desktop

Daniel19901_0-1718641263787.png
Daniel19901_0-1718641263787.png822×361 26.9 KB

Mobile:

Daniel19901_1-1718641339150.png
Daniel19901_1-1718641339150.png296×340 13.7 KB

2

Hi @Daniel19901 ,

Step 1: open file good-icons.css

Step 2: find and delete this code

@media (max-width: 425px) {
    .goodhl-product__item.goodhl-grid-item-2_mob {
        width: calc(50% - 40px) !important;
    }
}

Step 3: Insert the below code

@media (max-width: 425px) {
    .goodhl-product__item.goodhl-grid-item-2_mob {
        width: 50% !important;
    }
    .goodhl-product__title font {
        font-size: 12px !important;
        line-height: normal !important;
    }
    section.goodhl-product__wrapp {
        margin: 5px;
    }
}

here is result:

BSSCommerceB2B_0-1718643547272.png
BSSCommerceB2B_0-1718643547272.png474×756 34.6 KB

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you