Hi guys,
I have added a shadow to product grid view, but seems some elements need to be adjusted as follows:
1- Add top padding to the product title. Desktop and Mobile view.
2- Reduce gap between price and quantity.Desktop and Mobile view.
3- Reduce gap between bottons and tabs. Desktop and Mobile view.
4- center buttons in the middle. Desktop and Mobile view.
5- Align the grid to be in the middle…Mobile View.
5- Align product discription to the center of the grid…Desktop and Mobile view.
Thank you
allianceautoproducts.com
Add this CSS at the bottom of Online Store->Theme->Edit code->Assets->theme.css
.product-single__title {
margin-top: 15px;
}
.product-form {
padding-top: 0;
}
.product-single__description {
margin-top: 0;
}
button.shopify-payment-button__more-options.shopify-payment-button__button--hidden {
display: none;
}
.product-single .product-form__controls-group.product-form__controls-group--submit {
margin-left: -30px;
}
If you find our reply helpful, please hit Like and Mark it as a Solution.
An award-winning North American Shopify Development Agency That Delivers Powerful Results, Innovation, and Secure Digital Transformation.
Thank you. But in mobile view the grid is aligned to the left. And product discription text in all views needs to be pushed to the left a little bit.
Great work.
Thank you
Buttons also look very huge in mobile view.
I don’t have to find any issue in the mobile view. It looks fine. Still, If you have any problems, then explore with more details so we can help you.
