fix(custom_logo): Internationalize alternative image text

box · Apr 9, 2021 · 2762678 · 2762678
1 parent 3caf809
commit 2762678
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 4 deletions.
diff --git a/src/i18n/en-US.properties b/src/i18n/en-US.properties
@@ -34,6 +34,8 @@ print_loading=Preparing to print...
 print_ready=Ready to print.
 # Accessible text for right navigation arrow that navigates user to previous file in collection
 previous_file=Previous file
+# Alternative text for logo-image
+logo=Logo
 # Accessible text for right navigation arrow that navigates user to next file in collection
 next_file=Next file
 # Text shown while preview is loading

diff --git a/src/lib/PreviewUI.js b/src/lib/PreviewUI.js
@@ -48,6 +48,9 @@ class PreviewUI {
     /** @property {HTMLElement} - Preview container element which houses the sidebar and content */
     previewContainer;
 
+    /** @property {HTMLElement} - Preview container element which houses the custom-logo */
+    customLogoEl;
+
     /**
      * Destroy preview container content.
      *
@@ -112,6 +115,10 @@ class PreviewUI {
         this.container = this.container.querySelector(SELECTOR_BOX_PREVIEW_CONTAINER);
         this.previewContainer = this.container.querySelector(SELECTOR_BOX_PREVIEW);
         this.contentContainer = this.container.querySelector(SELECTOR_BOX_PREVIEW_CONTENT);
+        this.customLogoEl = this.container.querySelector(SELECTOR_BOX_PREVIEW_LOGO_CUSTOM);
+
+        // Set alternative accesible text
+        this.customLogoEl.setAttribute('alt', __('logo'));
 
         // Setup the header, buttons, and theme
         if (options.header !== 'none') {
@@ -385,9 +392,8 @@ class PreviewUI {
             const defaultLogoEl = headerEl.querySelector(SELECTOR_BOX_PREVIEW_LOGO_DEFAULT);
             defaultLogoEl.classList.add(CLASS_HIDDEN);
 
-            const customLogoEl = headerEl.querySelector(SELECTOR_BOX_PREVIEW_LOGO_CUSTOM);
-            customLogoEl.src = logoUrl;
-            customLogoEl.classList.remove(CLASS_HIDDEN);
+            this.customLogoEl.src = logoUrl;
+            this.customLogoEl.classList.remove(CLASS_HIDDEN);
         }
     }
 }

diff --git a/src/lib/shell.html b/src/lib/shell.html
@@ -8,7 +8,7 @@
                     ></path>
                 </svg>
             </span>
-            <img class="bp-is-hidden bp-custom-logo" alt="logo" />
+            <img class="bp-is-hidden bp-custom-logo" />
             <div class="bp-header-btns">
                 <button
                     class="bp-btn-plain bp-btn-annotate-draw bp-is-hidden"