Constrain annotation image proportions to address #236. Bug fix for #235

Smithsonian · Dec 13, 2023 · 03c8a0a · 03c8a0a
1 parent 4d1e442
commit 03c8a0a
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/source/client/annotations/CircleSprite.ts b/source/client/annotations/CircleSprite.ts
@@ -340,7 +340,7 @@ class CircleAnnotation extends AnnotationElement
         const annotationData = annotation.data;
 
         return html`<div class="sv-title">${annotation.title}</div>
-            ${annotationData.imageUri ? html`<div><img src="${this.sprite.assetManager.getAssetUrl(annotationData.imageUri)}"></div>` : null}
+            ${annotationData.imageUri ? html`<div><img alt="${annotation.imageAltText}" src="${this.sprite.assetManager.getAssetUrl(annotationData.imageUri)}">${annotation.imageCredit ? html`<div class="sv-img-credit">${annotation.imageCredit}</div>` : null}</div>` : null}
             <div class="sv-content"><p>${unsafeHTML(annotation.lead)}</p></div>
             ${annotationData.audioId ? html`<div id="audio_container" @pointerdown=${this.onClickAudio}></div>` : null}
             ${annotationData.articleId ? html`<ff-button inline text="Read more..." icon="document" @click=${this.onClickArticle}></ff-button>` : null}`;

diff --git a/source/client/ui/explorer/styles.scss b/source/client/ui/explorer/styles.scss
@@ -250,6 +250,7 @@ $pad: $canvas-border-width + $main-menu-button-size + 8px;
 
   img {
     max-height: 120px;
+    max-width: 100%;
   }
 
   .sv-img-credit {