How to remove image placeholder text on mobile - Focal Theme

[galleriste]

When the image hasn’t loaded yet on mobile the title of the product shows on the top left in the images place. I would like to remove it or maybe change it to white. Here is two pictures showing what I mean, the second one shows the text that I would like to remove.

Here is the website: https://568839.myshopify.com/

[websensepro]

Hi @galleriste

1. Go to Online Store → Theme → Edit code.
2. Open your theme.css / based.css file and paste the code in the bottom of the file.

.product-item__primary-image {
  font-size: 0 !important; 
  color: white !important;
}

If my reply is helpful, kindly click like and mark it as an accepted solution.

If you are happy with my help, you can help me buy a COFFEE

Thanks!

[galleriste]

Thanks! How about the same thing but for the product page?

[websensepro]

@galleriste for product page

1. Go to Online Store → Theme → Edit code.
2. Open your theme.css / based.css file and paste the code in the bottom of the file.

.product__media-image-wrapper.aspect-ratio.aspect-ratio--natural img {
    font-size: 0 !important;
    color: white !important;
}

[galleriste]

Perfect!