diff --git a/components/gallery/GalleryItem.vue b/components/gallery/GalleryItem.vue index df745da9ec..716b683ef4 100644 --- a/components/gallery/GalleryItem.vue +++ b/components/gallery/GalleryItem.vue @@ -8,7 +8,7 @@
- +
@@ -188,6 +191,8 @@ import { sanitizeIpfsUrl, toOriginalContentUrl } from '@/utils/ipfs' import { convertMarkdownToText } from '@/utils/markdown' import { generateNftImage } from '@/utils/seoImageGenerator' +const CONTAINER_ID = 'nft-img-container' + const NuxtImg = resolveComponent('NuxtImg') const { urlPrefix } = usePrefix() diff --git a/components/gallery/GalleryItemToolBar.vue b/components/gallery/GalleryItemToolBar.vue index aaec8605a5..42f5c53847 100644 --- a/components/gallery/GalleryItemToolBar.vue +++ b/components/gallery/GalleryItemToolBar.vue @@ -74,6 +74,10 @@ type ReloadElement = defineEmits(['toggle']) +const props = defineProps<{ + containerId: string +}>() + const { getNft: nft, getNftImage: nftImage, getNftMimeType: nftMimeType, getNftAnimation: nftAnimation, getNftAnimationMimeType: nftAnimationMimeType } = storeToRefs(useNftStore()) const isLoading = ref(false) @@ -126,7 +130,7 @@ const handleReloadClick = () => { } const openInNewTab = (selector: string, attribute: string = 'src') => { - const element = document.querySelector(selector) + const element = document.querySelector(`#${props.containerId} ${selector}`) if (element) { const src = element.getAttribute(attribute) if (src) {