Bug 1455922 - Create shared findbar CSS across platforms. r=dao
authorTim Nguyen <ntim.bugs@gmail.com>
Tue, 29 May 2018 20:45:22 +0200
changeset 420272 e57729f03ecbb76637d20db6c655f559c81ec8f6
parent 420271 fd067216c3a6ef2ff0620e25c2261186a8fdc714
child 420273 51db5a12a4108b3213e3d86a3251b074148d66cd
push id64584
push userntim.bugs@gmail.com
push dateTue, 29 May 2018 18:50:00 +0000
treeherderautoland@51db5a12a410 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdao
bugs1455922
milestone62.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1455922 - Create shared findbar CSS across platforms. r=dao MozReview-Commit-ID: Hv3WHysJOQX
toolkit/themes/linux/global/findBar.css
toolkit/themes/linux/global/jar.mn
toolkit/themes/osx/global/findBar.css
toolkit/themes/shared/findBar.inc.css
toolkit/themes/windows/global/findBar.css
toolkit/themes/windows/global/jar.mn
--- a/toolkit/themes/linux/global/findBar.css
+++ b/toolkit/themes/linux/global/findBar.css
@@ -1,173 +1,5 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-
-findbar {
-  border-top: 1px solid ThreeDShadow;
-  min-width: 1px;
-  transition-property: margin-bottom, opacity, visibility;
-  transition-duration: 150ms, 150ms, 0s;
-  transition-timing-function: ease-in-out, ease-in-out, linear;
-}
-
-findbar:-moz-lwtheme {
-  background-color: var(--toolbar-bgcolor);
-  color: var(--toolbar-color, var(--chrome-color, -moz-DialogText));
-}
-
-findbar[hidden] {
-  /* Override display:none to make the transition work. */
-  display: -moz-box;
-  visibility: collapse;
-  margin-bottom: -1em;
-  opacity: 0;
-  transition-delay: 0s, 0s, 150ms;
-}
-
-findbar[noanim] {
-  transition-duration: 0s !important;
-  transition-delay: 0s !important;
-}
-
-.findbar-container {
-  padding-inline-start: 8px;
-  padding-top: 4px;
-  padding-bottom: 4px;
-}
-
-.findbar-closebutton {
-  margin: 0 8px;
-}
-
-/* Search field */
-
-.findbar-textbox {
-  -moz-appearance: none;
-  border: 1px solid var(--lwt-toolbar-field-border-color, ThreeDShadow);
-  box-shadow: 0 0 1px 0 ThreeDShadow inset;
-  margin: 0;
-  padding: 5px;
-  width: 14em;
-}
-
-.findbar-textbox:-moz-lwtheme {
-  background-color: var(--lwt-toolbar-field-background-color, -moz-Field);
-  color: var(--lwt-toolbar-field-color, -moz-FieldText);
-}
-
-.findbar-textbox:-moz-locale-dir(ltr) {
-  border-radius: 3px 0 0 3px;
-  border-right-width: 0;
-}
-
-.findbar-textbox:-moz-locale-dir(rtl) {
-  border-radius: 0 3px 3px 0;
-  border-left-width: 0;
-}
-
-.findbar-textbox[focused="true"] {
-  border-color: Highlight;
-  box-shadow: 0 0 1px 0 Highlight inset;
-}
-
-.findbar-textbox[status="notfound"] {
-  background-color: #f66;
-  color: white;
-}
-
-.findbar-textbox[flash="true"] {
-  background-color: yellow;
-  color: black;
-}
-
-.findbar-textbox.minimal {
-  border-width: 1px;
-  border-radius: 3px;
-}
-
-.findbar-find-previous,
-.findbar-find-next {
-  margin-inline-start: 0;
-  -moz-appearance: none;
-  background: linear-gradient(rgba(255,255,255,.8) 1px, rgba(255,255,255,.4) 1px, rgba(255,255,255,.1));
-  border: 1px solid ThreeDShadow;
-  padding: 5px 9px;
-  line-height: 1em;
-  -moz-context-properties: fill;
-  fill: currentColor;
-  color: inherit;
-}
-
-.findbar-find-previous:focus,
-.findbar-find-next:focus {
-  border-color: Highlight;
-  box-shadow: 0 0 1px 0 Highlight inset;
-}
-
-.findbar-find-previous:not([disabled]):active,
-.findbar-find-next:not([disabled]):active {
-  background: rgba(23,50,76,.2);
-  border: 1px solid ThreeDShadow;
-  box-shadow: 0 1px 2px rgba(10,31,51,.2) inset;
-}
-
-.findbar-find-previous {
-  list-style-image: url(chrome://global/skin/icons/find-previous-arrow.svg);
-  border-inline-end-width: 0;
-}
-
-.findbar-find-next {
-  list-style-image: url(chrome://global/skin/icons/find-next-arrow.svg);
-}
-
-.findbar-find-next:-moz-lwtheme,
-.findbar-find-previous:-moz-lwtheme {
-  border-color: var(--lwt-toolbar-field-border-color);
-}
-
-.findbar-find-previous > .toolbarbutton-icon,
-.findbar-find-next > .toolbarbutton-icon {
-  margin: 0;
-}
-
-.findbar-find-previous[disabled="true"] > .toolbarbutton-icon,
-.findbar-find-next[disabled="true"] > .toolbarbutton-icon {
-  opacity: .4;
-}
-
-.findbar-find-next:-moz-locale-dir(ltr) {
-  border-top-right-radius: 2px;
-  border-bottom-right-radius: 2px;
-}
-
-.findbar-find-next:-moz-locale-dir(rtl) {
-  border-top-left-radius: 2px;
-  border-bottom-left-radius: 2px;
-}
-
-.findbar-find-previous:focus + .findbar-find-next {
-  border-inline-start-width: 0;
-}
-
-.findbar-find-previous:focus {
-  border-inline-end-width: 1px;
-}
-
-.findbar-highlight,
-.findbar-case-sensitive,
-.findbar-entire-word {
-  margin-inline-start: 5px;
-}
-
-.findbar-find-status,
-.findbar-matches {
-  color: GrayText;
-  margin: 0 !important;
-  margin-inline-start: 12px !important;
-}
-
-.find-status-icon[status="pending"] {
-  list-style-image: url("chrome://global/skin/icons/loading.png");
-}
+%include ../../shared/findBar.inc.css
--- a/toolkit/themes/linux/global/jar.mn
+++ b/toolkit/themes/linux/global/jar.mn
@@ -6,17 +6,17 @@
 
 toolkit.jar:
    skin/classic/global/autocomplete.css
    skin/classic/global/button.css
    skin/classic/global/checkbox.css
    skin/classic/global/colorpicker.css
    skin/classic/global/commonDialog.css
    skin/classic/global/dropmarker.css
-   skin/classic/global/findBar.css
+*  skin/classic/global/findBar.css
 *  skin/classic/global/global.css
    skin/classic/global/groupbox.css
    skin/classic/global/listbox.css
    skin/classic/global/menu.css
    skin/classic/global/menulist.css
    skin/classic/global/netError.css
 *  skin/classic/global/notification.css
 *  skin/classic/global/numberbox.css
--- a/toolkit/themes/osx/global/findBar.css
+++ b/toolkit/themes/osx/global/findBar.css
@@ -1,271 +1,90 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 %include shared.inc
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
+%include ../../shared/findBar.inc.css
 
 findbar {
   background: @scopeBarBackground@;
   border-top: @scopeBarSeparatorBorder@;
-  min-width: 1px;
-  transition-property: margin-bottom, opacity, visibility;
-  transition-duration: 150ms, 150ms, 0s;
-  transition-timing-function: ease-in-out, ease-in-out, linear;
-}
-
-findbar[hidden] {
-  /* Override display:none to make the transition work. */
-  display: -moz-box;
-  visibility: collapse;
-  margin-bottom: -1em;
-  opacity: 0;
-  transition-delay: 0s, 0s, 150ms;
-}
-
-findbar[noanim] {
-  transition-duration: 0s !important;
-  transition-delay: 0s !important;
-}
-
-findbar:-moz-lwtheme {
-  -moz-appearance: none;
-  background-color: var(--toolbar-bgcolor);
-  background-image: none;
-  border-style: none;
-  color: var(--toolbar-color, var(--chrome-color, -moz-DialogText));
 }
 
 .findbar-container {
   padding-inline-start: 2px;
-  padding-top: 4px;
-  padding-bottom: 4px;
 }
 
 label.findbar-find-fast {
   color: @scopeBarTitleColor@;
   margin: 0;
   margin-inline-start: 12px;
-  text-shadow: @loweredShadow@;
 }
 
 label.findbar-find-fast:-moz-lwtheme,
 .findbar-find-status:-moz-lwtheme {
   color: inherit;
-  text-shadow: inherit;
 }
 
 .findbar-closebutton {
   margin-inline-start: 4px;
+  margin-inline-end: 0;
   padding-inline-start: 0;
   padding-inline-end: 8px;
   border: none;
   /* make sure the closebutton is displayed as the first element in the bar: */
   -moz-box-ordinal-group: 0;
 }
 
-.findbar-find-next,
-.findbar-find-previous,
-.findbar-highlight,
-.findbar-case-sensitive,
-.findbar-entire-word {
-  -moz-appearance: none;
-  border-radius: 10000px;
-  border: @roundButtonBorderWidth@ @roundButtonBorderStyle@ @roundButtonBorderColor@;
+.findbar-find-next:not(:-moz-lwtheme),
+.findbar-find-previous:not(:-moz-lwtheme),
+.findbar-button {
+  border-style: @roundButtonBorderStyle@;
+  border-color: @roundButtonBorderColor@;
   color: @roundButtonColor@;
   background: @roundButtonBackground@;
-  box-shadow: @roundButtonShadow@;
-  margin: 0;
+}
+
+.findbar-button {
+  -moz-appearance: none;
+  border-width: @roundButtonBorderWidth@;
+  margin-inline-end: 5px;
+  padding: 2px 9px;
+  border-radius: 10000px;
 }
 
 .findbar-find-next:-moz-lwtheme,
 .findbar-find-previous:-moz-lwtheme {
-  background-image: linear-gradient(rgba(255,255,255,.6) 1px, rgba(255,255,255,.4) 1px, rgba(255,255,255,.1));
-}
-
-@media (-moz-mac-yosemite-theme) {
-  .findbar-find-previous,
-  .findbar-find-next {
-    border-radius: 3px;
-    box-shadow: none;
-  }
-}
-
-.findbar-highlight,
-.findbar-case-sensitive,
-.findbar-entire-word {
-  margin-inline-end: 5px;
-  padding: 2px 9px;
+  border-color: var(--lwt-toolbar-field-border-color, @roundButtonBorderColor@);
 }
 
-.findbar-highlight {
-  margin-inline-start: 8px;
-}
-
-.findbar-container > toolbarbutton:-moz-focusring,
-.findbar-find-next:-moz-focusring,
-.findbar-find-previous:-moz-focusring {
-  position: relative;
-  box-shadow: var(--focus-ring-box-shadow), @roundButtonShadow@;
-}
-
-.findbar-container > toolbarbutton[disabled] {
-  color: GrayText !important;
-}
-
-.findbar-find-next:not([disabled]):hover:active,
-.findbar-find-previous:not([disabled]):hover:active,
-.findbar-highlight:not([disabled]):hover:active,
-.findbar-case-sensitive:not([disabled]):hover:active,
-.findbar-entire-word:not([disabled]):hover:active,
-.findbar-highlight:not([disabled])[checked="true"],
-.findbar-case-sensitive:not([disabled])[checked="true"],
-.findbar-entire-word:not([disabled])[checked="true"] {
-  text-shadow: @loweredShadow@;
+.findbar-find-next:not(:-moz-lwtheme):not([disabled]):hover:active,
+.findbar-find-previous:not(:-moz-lwtheme):not([disabled]):hover:active,
+.findbar-button:not([disabled]):hover:active,
+.findbar-button:not([disabled])[checked="true"] {
   background: @roundButtonPressedBackground@;
   box-shadow: @roundButtonPressedShadow@;
 }
 
-.findbar-find-next:hover:active:-moz-focusring,
-.findbar-find-previous:hover:active:-moz-focusring {
-  text-shadow: @loweredShadow@;
-  background: @roundButtonPressedBackground@;
-  box-shadow: var(--focus-ring-box-shadow), @roundButtonPressedShadow@;
-}
-
-/* Search field */
-
-.findbar-textbox {
-  position: relative;
-  -moz-appearance: none;
-  border: @roundButtonBorderWidth@ @roundButtonBorderStyle@ var(--lwt-toolbar-field-border-color, @roundButtonBorderColor@);
-  border-radius: 10000px 0 0 10000px;
-  box-shadow: @roundButtonShadow@;
-  background: url("chrome://global/skin/icons/search-textbox.svg") -moz-Field no-repeat 5px center;
-  margin: 0;
-  padding: 2px 8px;
-  padding-inline-start: 19px;
-}
-
-.findbar-textbox:-moz-lwtheme {
-  background-color: var(--lwt-toolbar-field-background-color, -moz-Field);
-  color: var(--lwt-toolbar-field-color, -moz-FieldText);
-}
-
-.findbar-textbox:-moz-locale-dir(rtl) {
-  border-radius: 0 10000px 10000px 0;
-  background-position-x: calc(100% - 5px);
-}
-
-@media (-moz-mac-yosemite-theme) {
-  .findbar-textbox {
-    border-top-left-radius: 3px;
-    border-bottom-left-radius: 3px;
-    box-shadow: none;
-  }
-
-  .findbar-textbox:-moz-locale-dir(rtl) {
-    border-radius: 0 3px 3px 0;
+@media (-moz-mac-yosemite-theme: 0) {
+  .findbar-textbox,
+  .findbar-find-next {
+    border-radius: 10000px;
   }
 }
 
-.findbar-textbox:not([focused="true"]):-moz-lwtheme {
-  opacity: 0.9;
+.findbar-textbox {
+  border: @roundButtonBorderWidth@ @roundButtonBorderStyle@ var(--lwt-toolbar-field-border-color, @roundButtonBorderColor@);
+  background-image: url("chrome://global/skin/icons/search-textbox.svg");
+  background-repeat: no-repeat;
+  background-position: 5px center;
+  margin: 0;
+  padding-inline-start: 19px;
 }
 
 .findbar-textbox[focused="true"] {
   box-shadow: var(--focus-ring-box-shadow);
 }
 
-.findbar-textbox[flash="true"] {
-  background-color: #F7E379;
-}
-
-.findbar-textbox[status="notfound"] {
-  background-color: #FD919B;
-  color: #FFF;
-}
-
-.findbar-textbox.minimal {
-  border-radius: 10000px;
-  margin-inline-start: 5px;
-}
-
-/* Find previous/next buttons */
-
-.findbar-find-previous,
-.findbar-find-next {
-  margin-inline-start: 0;
-  padding: 3px 6px 1px;
-}
-
-.findbar-find-previous > .toolbarbutton-icon,
-.findbar-find-next > .toolbarbutton-icon {
-  margin: 0;
-}
-
-.findbar-find-previous {
-  border-left: none;
-  border-right: none;
-  margin-inline-end: 0;
-  list-style-image: url(chrome://global/skin/icons/find-previous-arrow.svg);
-  -moz-context-properties: fill;
-  fill: -moz-dialogtext;
-  border-radius: 0;
-}
-
-.findbar-find-next {
-  list-style-image: url(chrome://global/skin/icons/find-next-arrow.svg);
-  -moz-context-properties: fill;
-  fill: -moz-dialogtext;
-  padding-inline-end: 7px;
+.findbar-textbox:-moz-locale-dir(rtl) {
+  background-position-x: right 5px;
 }
-
-.findbar-find-next:-moz-lwtheme,
-.findbar-find-previous:-moz-lwtheme {
-  border-color: var(--lwt-toolbar-field-border-color);
-}
-
-.findbar-find-previous[disabled] {
-  fill: GrayText;
-}
-
-.findbar-find-next[disabled] {
-  fill: GrayText;
-}
-
-.findbar-find-next:-moz-locale-dir(ltr) {
-  border-top-left-radius: 0;
-  border-bottom-left-radius: 0;
-}
-
-.findbar-find-next:-moz-locale-dir(rtl) {
-  border-top-right-radius: 0;
-  border-bottom-right-radius: 0;
-}
-
-/* Status description */
-
-.find-status-icon {
-  display: none;
-}
-
-.find-status-icon[status="pending"] {
-  display: block;
-  list-style-image: url("chrome://global/skin/icons/loading.png");
-}
-
-@media (min-resolution: 2dppx) {
-  .find-status-icon[status="pending"] {
-    width: 16px;
-    list-style-image: url("chrome://global/skin/icons/loading@2x.png");
-  }
-}
-
-.findbar-find-status,
-.found-matches {
-  color: rgba(0,0,0,.5);
-  margin: 0 !important;
-  margin-inline-start: 12px !important;
-  text-shadow: 0 1px rgba(255,255,255,.4);
-}
copy from toolkit/themes/windows/global/findBar.css
copy to toolkit/themes/shared/findBar.inc.css
--- a/toolkit/themes/windows/global/findBar.css
+++ b/toolkit/themes/shared/findBar.inc.css
@@ -1,28 +1,26 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
 
 findbar {
-  box-shadow: 0 1px 1px rgba(0,0,0,.1) inset;
-  background-image: linear-gradient(rgba(0,0,0,.15) 1px, rgba(255,255,255,.15) 1px);
-  background-size: 100% 2px;
-  background-repeat: no-repeat;
+  border-top: 1px solid ThreeDShadow;
   min-width: 1px;
   transition-property: margin-bottom, opacity, visibility;
   transition-duration: 150ms, 150ms, 0s;
   transition-timing-function: ease-in-out, ease-in-out, linear;
 }
 
 findbar:-moz-lwtheme {
   background-color: var(--toolbar-bgcolor);
-  color: var(--toolbar-color, var(--chrome-color, -moz-DialogText));
+  background-image: none;
+  color: var(--toolbar-color, -moz-DialogText);
 }
 
 findbar[hidden] {
   /* Override display:none to make the transition work. */
   display: -moz-box;
   visibility: collapse;
   margin-bottom: -1em;
   opacity: 0;
@@ -36,43 +34,44 @@ findbar[noanim] {
 
 .findbar-container {
   padding-inline-start: 8px;
   padding-top: 4px;
   padding-bottom: 4px;
 }
 
 .findbar-closebutton {
-  margin-inline-start: 4px;
-  padding-inline-start: 0;
-  padding-inline-end: 8px;
-  border: none;
+  padding: 0 8px;
 }
 
-
 /* Search field */
 
 .findbar-textbox {
   -moz-appearance: none;
   background-color: -moz-Field;
-  border: 1px solid;
-  border-color: var(--lwt-toolbar-field-border-color, ThreeDShadow);
-  border-radius: 2px 0 0 2px;
+  border: 1px solid var(--lwt-toolbar-field-border-color, ThreeDShadow);
+  border-radius: 2px;
   margin: 0;
-  padding: 1px 5px;
+  padding: 2px 5px;
   width: 14em;
 }
 
 .findbar-textbox:-moz-lwtheme {
   background-color: var(--lwt-toolbar-field-background-color, -moz-Field);
   color: var(--lwt-toolbar-field-color, -moz-FieldText);
 }
 
+.findbar-textbox:-moz-locale-dir(ltr) {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
 .findbar-textbox:-moz-locale-dir(rtl) {
-  border-radius: 0 2px 2px 0;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
 }
 
 .findbar-textbox[focused="true"] {
   border-color: Highlight;
 }
 
 .findbar-textbox[status="notfound"] {
   background-color: #f66;
@@ -83,74 +82,70 @@ findbar[noanim] {
   background-color: yellow;
   color: black;
 }
 
 .findbar-textbox.minimal {
   border-radius: 2px;
 }
 
-/* Buttons */
-
 .findbar-find-previous,
 .findbar-find-next {
   margin-inline-start: 0;
   -moz-appearance: none;
   background: linear-gradient(rgba(255,255,255,.8) 1px, rgba(255,255,255,.4) 1px, rgba(255,255,255,.1));
   border: 1px solid ThreeDShadow;
-  padding: 1px 5px;
+  padding: 2px 5px;
   line-height: 1em;
   -moz-context-properties: fill;
   fill: currentColor;
   color: inherit;
 }
 
-.findbar-find-previous:not([disabled]):active,
-.findbar-find-next:not([disabled]):active {
+.findbar-find-previous:not([disabled]):hover:active,
+.findbar-find-next:not([disabled]):hover:active {
   background: rgba(23,50,76,.2);
   box-shadow: 0 1px 2px rgba(10,31,51,.2) inset;
 }
 
 .findbar-find-previous {
   list-style-image: url(chrome://global/skin/icons/find-previous-arrow.svg);
+  border-right-width: 0;
+  border-left-width: 0;
+  margin-inline-end: 0;
 }
 
 .findbar-find-next {
   list-style-image: url(chrome://global/skin/icons/find-next-arrow.svg);
+  border-radius: 2px;
 }
 
 .findbar-find-next:-moz-lwtheme,
 .findbar-find-previous:-moz-lwtheme {
-  border-color: var(--lwt-toolbar-field-border-color);
-}
-
-.findbar-find-previous,
-.findbar-find-previous:not([disabled]):active {
-  border-right: none;
-  border-left: none;
+  border-color: var(--lwt-toolbar-field-border-color, ThreeDShadow);
 }
 
 .findbar-find-previous > .toolbarbutton-icon,
 .findbar-find-next > .toolbarbutton-icon {
   margin: 0;
 }
 
 .findbar-find-previous[disabled="true"] > .toolbarbutton-icon,
 .findbar-find-next[disabled="true"] > .toolbarbutton-icon {
   opacity: .4;
 }
 
 .findbar-find-next:-moz-locale-dir(ltr) {
-  border-top-right-radius: 2px;
-  border-bottom-right-radius: 2px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
 }
 
 .findbar-find-next:-moz-locale-dir(rtl) {
-  border-top-left-radius: 2px;
-  border-bottom-left-radius: 2px;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
 }
 
 .findbar-highlight,
 .findbar-case-sensitive,
 .findbar-entire-word {
   margin-inline-start: 5px;
 }
 
--- a/toolkit/themes/windows/global/findBar.css
+++ b/toolkit/themes/windows/global/findBar.css
@@ -1,179 +1,5 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-
-findbar {
-  box-shadow: 0 1px 1px rgba(0,0,0,.1) inset;
-  background-image: linear-gradient(rgba(0,0,0,.15) 1px, rgba(255,255,255,.15) 1px);
-  background-size: 100% 2px;
-  background-repeat: no-repeat;
-  min-width: 1px;
-  transition-property: margin-bottom, opacity, visibility;
-  transition-duration: 150ms, 150ms, 0s;
-  transition-timing-function: ease-in-out, ease-in-out, linear;
-}
-
-findbar:-moz-lwtheme {
-  background-color: var(--toolbar-bgcolor);
-  color: var(--toolbar-color, var(--chrome-color, -moz-DialogText));
-}
-
-findbar[hidden] {
-  /* Override display:none to make the transition work. */
-  display: -moz-box;
-  visibility: collapse;
-  margin-bottom: -1em;
-  opacity: 0;
-  transition-delay: 0s, 0s, 150ms;
-}
-
-findbar[noanim] {
-  transition-duration: 0s !important;
-  transition-delay: 0s !important;
-}
-
-.findbar-container {
-  padding-inline-start: 8px;
-  padding-top: 4px;
-  padding-bottom: 4px;
-}
-
-.findbar-closebutton {
-  margin-inline-start: 4px;
-  padding-inline-start: 0;
-  padding-inline-end: 8px;
-  border: none;
-}
-
-
-/* Search field */
-
-.findbar-textbox {
-  -moz-appearance: none;
-  background-color: -moz-Field;
-  border: 1px solid;
-  border-color: var(--lwt-toolbar-field-border-color, ThreeDShadow);
-  border-radius: 2px 0 0 2px;
-  margin: 0;
-  padding: 1px 5px;
-  width: 14em;
-}
-
-.findbar-textbox:-moz-lwtheme {
-  background-color: var(--lwt-toolbar-field-background-color, -moz-Field);
-  color: var(--lwt-toolbar-field-color, -moz-FieldText);
-}
-
-.findbar-textbox:-moz-locale-dir(rtl) {
-  border-radius: 0 2px 2px 0;
-}
-
-.findbar-textbox[focused="true"] {
-  border-color: Highlight;
-}
-
-.findbar-textbox[status="notfound"] {
-  background-color: #f66;
-  color: white;
-}
-
-.findbar-textbox[flash="true"] {
-  background-color: yellow;
-  color: black;
-}
-
-.findbar-textbox.minimal {
-  border-radius: 2px;
-}
-
-/* Buttons */
-
-.findbar-find-previous,
-.findbar-find-next {
-  margin-inline-start: 0;
-  -moz-appearance: none;
-  background: linear-gradient(rgba(255,255,255,.8) 1px, rgba(255,255,255,.4) 1px, rgba(255,255,255,.1));
-  border: 1px solid ThreeDShadow;
-  padding: 1px 5px;
-  line-height: 1em;
-  -moz-context-properties: fill;
-  fill: currentColor;
-  color: inherit;
-}
-
-.findbar-find-previous:not([disabled]):active,
-.findbar-find-next:not([disabled]):active {
-  background: rgba(23,50,76,.2);
-  box-shadow: 0 1px 2px rgba(10,31,51,.2) inset;
-}
-
-.findbar-find-previous {
-  list-style-image: url(chrome://global/skin/icons/find-previous-arrow.svg);
-}
-
-.findbar-find-next {
-  list-style-image: url(chrome://global/skin/icons/find-next-arrow.svg);
-}
-
-.findbar-find-next:-moz-lwtheme,
-.findbar-find-previous:-moz-lwtheme {
-  border-color: var(--lwt-toolbar-field-border-color);
-}
-
-.findbar-find-previous,
-.findbar-find-previous:not([disabled]):active {
-  border-right: none;
-  border-left: none;
-}
-
-.findbar-find-previous > .toolbarbutton-icon,
-.findbar-find-next > .toolbarbutton-icon {
-  margin: 0;
-}
-
-.findbar-find-previous[disabled="true"] > .toolbarbutton-icon,
-.findbar-find-next[disabled="true"] > .toolbarbutton-icon {
-  opacity: .4;
-}
-
-.findbar-find-next:-moz-locale-dir(ltr) {
-  border-top-right-radius: 2px;
-  border-bottom-right-radius: 2px;
-}
-
-.findbar-find-next:-moz-locale-dir(rtl) {
-  border-top-left-radius: 2px;
-  border-bottom-left-radius: 2px;
-}
-
-.findbar-highlight,
-.findbar-case-sensitive,
-.findbar-entire-word {
-  margin-inline-start: 5px;
-}
-
-.findbar-highlight > .toolbarbutton-icon,
-.findbar-case-sensitive > .toolbarbutton-icon,
-.findbar-entire-word > .toolbarbutton-icon {
-  display: none;
-}
-
-.findbar-find-status,
-.found-matches {
-  color: GrayText;
-  margin: 0 !important;
-  margin-inline-start: 12px !important;
-}
-
-.find-status-icon[status="pending"] {
-  list-style-image: url("chrome://global/skin/icons/loading.png");
-}
-
-@media (min-resolution: 1.1dppx) {
-  .find-status-icon[status="pending"] {
-    width: 16px;
-    list-style-image: url("chrome://global/skin/icons/loading@2x.png");
-  }
-}
+%include ../../shared/findBar.inc.css
--- a/toolkit/themes/windows/global/jar.mn
+++ b/toolkit/themes/windows/global/jar.mn
@@ -13,17 +13,17 @@ toolkit.jar:
 * skin/classic/global/menu.css
   skin/classic/global/menulist.css
 * skin/classic/global/popup.css
   skin/classic/global/radio.css
   skin/classic/global/tabbox.css
   skin/classic/global/textbox.css
   skin/classic/global/colorpicker.css
   skin/classic/global/commonDialog.css
-  skin/classic/global/findBar.css
+* skin/classic/global/findBar.css
 * skin/classic/global/global.css
   skin/classic/global/listbox.css
   skin/classic/global/netError.css
 * skin/classic/global/numberbox.css
 * skin/classic/global/notification.css
   skin/classic/global/printPageSetup.css
   skin/classic/global/printPreview.css
   skin/classic/global/scrollbox.css