MD WebUI: Fix minor rendering problems in <cr-toolbar>

In crrev.com/589355, the <cr-toolbar> element moved from using
paper-input to a native <input> element. This CL fixes two minor issues
that came about as a result of this change:

* Fix font rendering issues on macOS so that text is the right size and
  antialiased correctly
* Ensure that right clicking shows the <input> context menu
* Prevent label text from wrapping during animations

BUG=589355,666183,666180
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2502413003
Cr-Commit-Position: refs/heads/master@{#433107}
(cherry picked from commit 572f871)

Review URL: https://codereview.chromium.org/2520623004 .

Cr-Commit-Position: refs/branch-heads/2924@{#15}
Cr-Branched-From: 3a87aec-refs/heads/master@{#433059}

chrome/browser/resources/md_downloads/vulcanized.html

@@ -2981,7 +2981,8 @@ <h3 id="date">[[computeDate_(data.hideDate, data.since_string, data.date_string)
 }
 
 #searchTerm {
-  -webkit-margin-start: 2px;
+  -webkit-font-smoothing: antialiased;
+        -webkit-margin-start: 2px;
         flex: 1;
         line-height: 185%;
         position: relative;
@@ -2991,9 +2992,11 @@ <h3 id="date">[[computeDate_(data.hideDate, data.since_string, data.date_string)
   bottom: 0;
         cursor: text;
         left: 0;
+        overflow: hidden;
         position: absolute;
         right: 0;
         top: 0;
+        white-space: nowrap;
 }
 
 :host([has-search-text_]) label {
@@ -3005,9 +3008,10 @@ <h3 id="date">[[computeDate_(data.hideDate, data.since_string, data.date_string)
         background: transparent;
         border: none;
         color: white;
-        font-family: inherit;
+        font: inherit;
         outline: none;
         padding: 0;
+        position: relative;
         width: 100%;
 }
 

chrome/browser/resources/md_history/app.vulcanized.html

@@ -1849,7 +1849,8 @@
 }
 
 #searchTerm {
-  -webkit-margin-start: 2px;
+  -webkit-font-smoothing: antialiased;
+        -webkit-margin-start: 2px;
         flex: 1;
         line-height: 185%;
         position: relative;
@@ -1859,9 +1860,11 @@
   bottom: 0;
         cursor: text;
         left: 0;
+        overflow: hidden;
         position: absolute;
         right: 0;
         top: 0;
+        white-space: nowrap;
 }
 
 :host([has-search-text_]) label {
@@ -1873,9 +1876,10 @@
         background: transparent;
         border: none;
         color: white;
-        font-family: inherit;
+        font: inherit;
         outline: none;
         padding: 0;
+        position: relative;
         width: 100%;
 }
 

ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_search_field.html

@@ -58,6 +58,7 @@
 
       /* Input field. */
       #searchTerm {
+        -webkit-font-smoothing: antialiased;
         -webkit-margin-start: 2px;
         flex: 1;
         line-height: 185%;
@@ -68,9 +69,11 @@
         bottom: 0;
         cursor: text;
         left: 0;
+        overflow: hidden;
         position: absolute;
         right: 0;
         top: 0;
+        white-space: nowrap;
       }
 
       :host([has-search-text_]) label {
@@ -82,9 +85,10 @@
         background: transparent;
         border: none;
         color: white;
-        font-family: inherit;
+        font: inherit;
         outline: none;
         padding: 0;
+        position: relative;
         width: 100%;
       }