Decrease product image height + thumbnail arrows bigger?

[Ryan1998]

Can anyone help me decrease product image height + thumbnail arrows bigger? Happy to donate if someone can help.

url: https://errival.com/products/errival%E2%84%A2-mini-rubber-band-shotgun

[Ryan1998]

DESKTOP VIEW ONLY PLEASE

[BSSCommerce-B2B]

Hi @Ryan1998

Step 1. Go to Admin → Online store → Theme > Edit code

Step 2. Find the file section-main-product.css. Search for the following CSS snippet

@media screen and (min-width: 750px) {
    .product__column-sticky {
        display: block;
        position: sticky;
        top: 3rem;
        z-index: 2;
    }
}

Please change to it

@media screen and (min-width: 750px) {
    .product__column-sticky {
        display: block;
        position: sticky;
        top: 7rem;
        z-index: 2;
    }
    .product__column-sticky slider-component.slider-mobile-gutter:not(.quick-add-hidden) {
        scale: 0.9;
        transform: translateY(-2.4em);
    }

    .product__column-sticky .quick-add-hidden {
       transform: translateY(-3.4em);
    }

    .product__column-sticky .slider-button {
        scale: 6;
    }
}

The result

When scrolling all the way down, everything is aligned.

If it helps you, please like and mark it as the solution.

Best Regards

[BSSCommerce-B2B]

Hi @Ryan1998

Has your issue been resolved?

[Ryan1998]

yes thanks