DUPLICATE: WooCommerce Product Lightbox (PhotoSwipe) styles are broken by layer(bricks)

Bugs
1

Hi everyone,

I’m experiencing an issue with the standard WooCommerce product gallery lightbox on my product pages. The lightbox functionality is broken because its CSS styles are not being applied correctly.

Upon inspecting the page, I found that the core PhotoSwipe CSS files from WooCommerce are being loaded via an @import rule and are being forced into the bricks CSS layer, like this:

@import url('https://mirater.ua/wp-content/plugins/woocommerce/assets/css/photoswipe/photoswipe.min.css?ver=10.1.2' media='all') layer(bricks); @import url('https://mirater.ua/wp-content/plugins/woocommerce/assets/css/photoswipe/default-skin/default-skin.min.css?ver=10.1.2' media='all') layer(bricks);

540270519_4051451405115639_888975424081031001_n
540270519_4051451405115639_888975424081031001_n1226×268 46.3 KB

2

Hi @Faradei,

thank you for investigating this. I can confirm that this is the issue and I we already have an internal task for it. It was also reported earlier on the forum here:

so that’s why I’ll mark this topic as a duplicate. But, I’ll mention your observations in our task as well.

Once we release a fix, we will update the topic mentioned above.

Thank you,
Matej

1 Like