How to make price visible

Site URL: https://gopher-tambourine-2t62.squarespace.com/shop

Hi, so I'm currently starting off with the MARTA theme and the issue that I've found is that when view the shop page from a mobile device the price doesn't appear unless I tap to view the product. I would really like for the price to show where I've marked. if anybody can help that would be great! Thanks in advance.

Add to Home . Design > Custom CSS

@media screen and (max-width:640px) {
section.ProductList-overlay {
    opacity: 1 !important;
}
.ProductList-meta {
    opacity: 1 !important;
}
}

13 hours ago, kanware said:

I'm currently starting off with the MARTA theme and the issue that I've found is that when view the shop page from a mobile device the price doesn't appear unless I tap to view the product.

You can show the product metadata below the products on mobile without code but if you want the product metadata to be overlaid onto the images, you'll need to add some Custom CSS ("styling code") as Tuan mentions above.

To show the description and price below the product images on mobile, go to Design > Site Styles and look for the PRODUCTS: DETAILS section. In this section you'll see a tweak called Position (Mobile). Change this from Overlay to Under.

Notes:
This is specific to Product List pages on the Brine template family (Squarespace 7.0). Marta is part of the Brine template family.