Fix background displaying where it shouldnt

yomidevs · Dec 26, 2024 · 24ae7d0 · 24ae7d0
1 parent 24b0542
commit 24ae7d0
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 7 deletions.
diff --git a/ext/css/structured-content.css b/ext/css/structured-content.css
@@ -94,21 +94,25 @@
     outline: none;
     width: 100%;
 }
-.gloss-image-link[data-image-rendering=pixelated] .gloss-image {
+.gloss-image-link[data-image-rendering=pixelated] .gloss-image,
+.gloss-image-link[data-image-rendering=pixelated] .gloss-image-background {
     image-rendering: auto;
     image-rendering: -moz-crisp-edges;
     image-rendering: -webkit-optimize-contrast;
     image-rendering: pixelated;
     image-rendering: crisp-edges;
 }
-.gloss-image-link[data-image-rendering=crisp-edges] .gloss-image {
+.gloss-image-link[data-image-rendering=crisp-edges] .gloss-image,
+.gloss-image-link[data-image-rendering=crisp-edges] .gloss-image-background {
     image-rendering: auto;
     image-rendering: -moz-crisp-edges;
     image-rendering: -webkit-optimize-contrast;
     image-rendering: crisp-edges;
 }
 :root[data-browser=firefox] .gloss-image-link[data-image-rendering=crisp-edges] .gloss-image,
-:root[data-browser=firefox-mobile] .gloss-image-link[data-image-rendering=crisp-edges] .gloss-image {
+:root[data-browser=firefox] .gloss-image-link[data-image-rendering=crisp-edges] .gloss-image-background,
+:root[data-browser=firefox-mobile] .gloss-image-link[data-image-rendering=crisp-edges] .gloss-image,
+:root[data-browser=firefox-mobile] .gloss-image-link[data-image-rendering=crisp-edges] .gloss-image-background {
     image-rendering: auto;
 }
 .gloss-image-link[data-has-aspect-ratio=true] .gloss-image-sizer {
@@ -135,6 +139,9 @@
 .gloss-image-link[data-appearance=monochrome] .gloss-image {
     filter: grayscale(1);
 }
+.gloss-image-link:not([data-appearance=monochrome]) .gloss-image-background {
+    display: none;
+}
 
 .gloss-image-link[data-size-units=em] .gloss-image-container {
     font-size: 1em;

diff --git a/ext/js/display/structured-content-generator.js b/ext/js/display/structured-content-generator.js
@@ -104,10 +104,6 @@ export class StructuredContentGenerator {
         const overlay = this._createElement('span', 'gloss-image-container-overlay');
         imageContainer.appendChild(overlay);
 
-        const linkText = this._createElement('span', 'gloss-image-link-text');
-        linkText.textContent = 'Image';
-        node.appendChild(linkText);
-
         node.dataset.path = path;
         node.dataset.dictionary = dictionary;
         node.dataset.imageLoadState = 'not-loaded';