andreknieriem / simplelightbox

Touch-friendly image lightbox for mobile and desktop
https://simplelightbox.js.org
MIT License
1.11k stars 173 forks source link

Issue with too many classes (Tailwind) #314

Closed reverdin closed 1 year ago

reverdin commented 1 year ago

I started using tailwind and tried to integrate your very nice lightbox in a tailwind project.

It seems that the generateQuerySelector compose a query selector with all the tree and using all classes so I get the following error: Uncaught DOMException: Failed to execute 'querySelector' on 'Document': ' HTML > BODY.overflow-x-hidden.font-abcmarfa.concerts.lan_fr.hidden-scroll:nth-child(2) > DIV:nth-child(1) > DIV.container.space-y-7.mx-auto.py-14.max-w-[764px]:nth-child(6) > DIV.relative.px-16.md:px-0.overflow-visible:nth-child(2) > DIV#galleryswiper.swiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden:nth-child(1) > DIV#swiperlighbox.swiper-wrapper.locglightbox:nth-child(1) > A.swiper-slide.h-auto.swiper-slide-active:nth-child(1) img' is not a valid selector.

It seems the query selector is too long as it takes all tailwind classes.

Do you know if there is a workaround ?

I use the 2.13.0 Version

Thanks for your work

Debesyla commented 1 year ago

@reverdin did you manage to find any workaround/hack? 😆

reverdin commented 1 year ago

@reverdin did you manage to find any workaround/hack? 😆

Unfortunately not

andreknieriem commented 1 year ago

I am trying to fix this right now.

reverdin commented 1 year ago

Great. Will check this tomorrow. Thanks