Variant size

Store Design
,
1

2235157e3d8065a255f1767d86553a34.png
2235157e3d8065a255f1767d86553a34.png1688×588 16.9 KB

would like to make the variant boxes smaller.. can you help with this?

2

Hello @Cameronrikko
Go to online store ----> themes ----> actions ----> edit code ---->Theme.css
add this code at the end of the file and save.

label.block-swatch {
height: 30px !important;
width: 15% !important;
}

result

13.png
13.png758×318 4.13 KB

If this was helpful, hit the like button and accept the solution.
Thanks

3

is it possible to make the text inside smaller and the add to cart thinner/quanity box smaller too.

thanks

4

Go to online store ----> themes ----> actions ----> edit code ---->Theme.css
add this code at the end of the file and save.

@media screen and (min-width: 700px) {
label.block-swatch {
height: 35px !important;
width: 14% !important;
font-size: 15px !important;
}
button.button.button--xl.button--secondary {
height: 56px;
}
.button--xl {
padding-block-start: 0.75rem;
}

quantity-selector.quantity-selector {
height: 40px !important;
width: 9rem !important;
}
}

result

2.png
2.png789×590 15.5 KB

If this was helpful, hit the like button and accept the solution.
Thanks