🐛 Fix sponsor display issue by hiding element on image error (#14097)

diff --git a/docs/en/docs/css/custom.css b/docs/en/docs/css/custom.css
index 05bfd0fe86871f024baebbe486d119f98141a40d..b192f6123a27399e3b44e379427434ca52d5d34b 100644 (file)
--- a/docs/en/docs/css/custom.css
+++ b/docs/en/docs/css/custom.css
@@ -124,11 +124,6 @@ a.announce-link:hover {
   border-radius: 20px;
 }
 
-/* Hide .sponsor-badge when .sponsor-image is display none */
-.announce-wrapper a:has(.sponsor-image[style*="display: none"]) .sponsor-badge {
-  display: none;
-}
-
 .announce-wrapper>div {
   min-height: 40px;
   display: flex;

diff --git a/docs/en/docs/js/custom.js b/docs/en/docs/js/custom.js
index 4c0ada312e00a68fc31870d35bad29660f296ddb..425b7fce7fe38d703a5ac0e4c582849ce1280afa 100644 (file)
--- a/docs/en/docs/js/custom.js
+++ b/docs/en/docs/js/custom.js
@@ -135,10 +135,28 @@ async function showRandomAnnouncement(groupId, timeInterval) {
     }
 }
 
+function hideSponsorOnImageError() {
+    const sponsorImages = document.querySelectorAll('.sponsor-image');
+    const announceRight = document.getElementById('announce-right');
+
+    function hideAnnounceRight() {
+        if (announceRight) {
+            announceRight.style.display = 'none';
+        }
+    }
+
+    sponsorImages.forEach(function(img) {
+        img.addEventListener('error', function() {
+            hideAnnounceRight();
+        });
+    });
+}
+
 async function main() {
     setupTermynal();
     showRandomAnnouncement('announce-left', 5000)
     showRandomAnnouncement('announce-right', 10000)
+    hideSponsorOnImageError();
 }
 document$.subscribe(() => {
     main()