From d0354d20b333d7bcd1ad1ec9069c4167d8fe7f61 Mon Sep 17 00:00:00 2001
From: Jonas Jenwald <jonas.jenwald@gmail.com>
Date: Thu, 3 Feb 2022 21:40:25 +0100
Subject: [PATCH 1/2] Avoid the `findResultsCount` span taking up (vertical)
 space when hidden (PR 13261 follow-up)

When the viewer becomes narrow, the `PDFFindBar` will (forcibly) wrap its elements to prevent it from extending to the full window width.
Currently, after PR 13261, this now leads to the `findResultsCount` span taking up vertical space *unconditionally* when the findbar is wrapped. To avoid a blank space being shown in this case, before searching has begun, place the `findResultsCount` span in a "message" rather than an "options" container.
---
 web/viewer.css  | 2 +-
 web/viewer.html | 5 ++---
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/web/viewer.css b/web/viewer.css
index 0a545b24e..a7a1188ef 100644
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -502,7 +502,7 @@ html[dir="rtl"] #outerContainer.sidebarOpen #loadingBar {
 .findbar.wrapContainers > div {
   clear: both;
 }
-.findbar.wrapContainers > div#findbarMessageContainer {
+.findbar.wrapContainers > div.findbarMessageContainer {
   height: auto;
 }
 html[dir="ltr"] .findbar {
diff --git a/web/viewer.html b/web/viewer.html
index e0924307c..16e0ccefa 100644
--- a/web/viewer.html
+++ b/web/viewer.html
@@ -141,11 +141,10 @@ See https://github.com/adobe-type-tools/cmap-resources
             <label for="findEntireWord" class="toolbarLabel" data-l10n-id="find_entire_word_label">Whole words</label>
           </div>
 
-          <div id="findbarOptionsThreeContainer">
+          <div class="findbarMessageContainer">
             <span id="findResultsCount" class="toolbarLabel hidden"></span>
           </div>
-
-          <div id="findbarMessageContainer">
+          <div class="findbarMessageContainer">
             <span id="findMsg" class="toolbarLabel"></span>
           </div>
         </div>  <!-- findbar -->

From 6fe4b3a5ae5fb132043ba97ea8c4a068aac7993e Mon Sep 17 00:00:00 2001
From: Jonas Jenwald <jonas.jenwald@gmail.com>
Date: Thu, 3 Feb 2022 22:16:56 +0100
Subject: [PATCH 2/2] Simplify the `findResultsCount` span toggling, by using
 the same approach as with the `findMsg` span

---
 web/pdf_find_bar.js | 1 -
 web/viewer.css      | 2 ++
 web/viewer.html     | 2 +-
 3 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/web/pdf_find_bar.js b/web/pdf_find_bar.js
index 54fda4ddb..c004017a7 100644
--- a/web/pdf_find_bar.js
+++ b/web/pdf_find_bar.js
@@ -163,7 +163,6 @@ class PDFFindBar {
     }
     matchCountMsg.then(msg => {
       this.findResultsCount.textContent = msg;
-      this.findResultsCount.classList.toggle("hidden", !total);
       // Since `updateResultsCount` may be called from `PDFFindController`,
       // ensure that the width of the findbar is always updated correctly.
       this._adjustWidth();
diff --git a/web/viewer.css b/web/viewer.css
index a7a1188ef..b7b4fc792 100644
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -691,6 +691,8 @@ html[dir="ltr"] .doorHangerRight:before {
 #findMsg {
   color: rgba(251, 0, 0, 1);
 }
+
+#findResultsCount:empty,
 #findMsg:empty {
   display: none;
 }
diff --git a/web/viewer.html b/web/viewer.html
index 16e0ccefa..1317e0deb 100644
--- a/web/viewer.html
+++ b/web/viewer.html
@@ -142,7 +142,7 @@ See https://github.com/adobe-type-tools/cmap-resources
           </div>
 
           <div class="findbarMessageContainer">
-            <span id="findResultsCount" class="toolbarLabel hidden"></span>
+            <span id="findResultsCount" class="toolbarLabel"></span>
           </div>
           <div class="findbarMessageContainer">
             <span id="findMsg" class="toolbarLabel"></span>