From fc602c65c092d80839a50dc40742eb2ee5b2cef9 Mon Sep 17 00:00:00 2001
From: Calixte Denizet <calixte.denizet@gmail.com>
Date: Tue, 6 Aug 2024 10:17:15 +0200
Subject: [PATCH] [Editor] Update the disclaimer string in the new alt-text
 dialog (bug 1911738)

And tweak the css in order to take into account that disclaimer can be on two (or more lines).
---
 l10n/en-US/viewer.ftl                   | 2 +-
 web/annotation_editor_layer_builder.css | 6 +++---
 web/viewer.html                         | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/l10n/en-US/viewer.ftl b/l10n/en-US/viewer.ftl
index 3c3bed572b394..c28352e692e2b 100644
--- a/l10n/en-US/viewer.ftl
+++ b/l10n/en-US/viewer.ftl
@@ -433,7 +433,7 @@ pdfjs-editor-new-alt-text-textarea =
 pdfjs-editor-new-alt-text-description = Short description for people who can’t see the image or when the image doesn’t load.
 
 # This is a required legal disclaimer that refers to the automatically created text inside the alt text box above this text. It disappears if the text is edited by a human.
-pdfjs-editor-new-alt-text-disclaimer = This alt text was created automatically.
+pdfjs-editor-new-alt-text-disclaimer1 = This alt text was created automatically and may be inaccurate.
 pdfjs-editor-new-alt-text-disclaimer-learn-more-url = Learn more
 
 pdfjs-editor-new-alt-text-create-automatically-button-label = Create alt text automatically
diff --git a/web/annotation_editor_layer_builder.css b/web/annotation_editor_layer_builder.css
index 9bb01389c8abf..33d1755848692 100644
--- a/web/annotation_editor_layer_builder.css
+++ b/web/annotation_editor_layer_builder.css
@@ -973,20 +973,20 @@
 
         #newAltTextDisclaimer {
           display: flex;
+          flex-direction: row;
           align-items: center;
           gap: 4px;
-          align-self: stretch;
-          flex-wrap: wrap;
           font-size: 11px;
 
           &::before {
             content: "";
             display: inline-block;
-            width: 16px;
+            width: 17px;
             height: 16px;
             mask-image: var(--new-alt-text-ai-disclaimer-icon);
             mask-size: cover;
             background-color: var(--text-secondary-color);
+            flex: 1 0 auto;
           }
         }
       }
diff --git a/web/viewer.html b/web/viewer.html
index e9162220358f4..f65d9bf56f781 100644
--- a/web/viewer.html
+++ b/web/viewer.html
@@ -569,7 +569,7 @@
                     <textarea id="newAltTextDescriptionTextarea" placeholder="Write your description here…" aria-labelledby="descriptionAreaLabel" data-l10n-id="pdfjs-editor-new-alt-text-textarea" tabindex="0"></textarea>
                   </div>
                   <span id="newAltTextDescription" role="note" data-l10n-id="pdfjs-editor-new-alt-text-description">Short description for people who can’t see the image or when the image doesn’t load.</span>
-                  <div id="newAltTextDisclaimer" role="note"><span data-l10n-id="pdfjs-editor-new-alt-text-disclaimer">This alt text was created automatically.</span> <a href="https://support.mozilla.org/en-US/kb/pdf-alt-text" target="_blank" rel="noopener noreferrer" id="newAltTextLearnMore" data-l10n-id="pdfjs-editor-new-alt-text-disclaimer-learn-more-url" tabindex="0">Learn more</a></div>
+                  <div id="newAltTextDisclaimer" role="note"><div><span data-l10n-id="pdfjs-editor-new-alt-text-disclaimer1">This alt text was created automatically and may be inaccurate.</span> <a href="https://support.mozilla.org/en-US/kb/pdf-alt-text" target="_blank" rel="noopener noreferrer" id="newAltTextLearnMore" data-l10n-id="pdfjs-editor-new-alt-text-disclaimer-learn-more-url" tabindex="0">Learn more</a></div></div>
                 </div>
                 <div id="newAltTextCreateAutomatically" class="toggler">
                   <button id="newAltTextCreateAutomaticallyButton" class="toggle-button" type="button" aria-pressed="true" tabindex="0"></button>