Issue #1700 - Apply background color instead of inset shadow for findbar input.

This changes the toolkit theme for Linux and Windows (Mac already did this) to
style the input textbox on the findbar with -moz-appearance:none so as to give
us styling control (as opposed to using a native widget style) and apply a
neutral style to it.
Also ensures Mac remains readable in case of poorly contrasting text.

3 files changed, 26 insertions, 6 deletions

diff --git a/toolkit/themes/linux/global/findBar.css b/toolkit/themes/linux/global/findBar.css
index e3e2ad086..4a9df23ae 100644
--- a/toolkit/themes/linux/global/findBar.css
+++ b/toolkit/themes/linux/global/findBar.css
@@ -5,9 +5,9 @@
 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
 
 findbar {
+  padding: 4px 8px;
   border-top: 2px solid;
   -moz-border-top-colors: ThreeDShadow ThreeDHighlight;
-  padding-bottom: 1px;
   min-width: 1px;
   transition-property: margin-bottom, opacity, visibility;
   transition-duration: 150ms, 150ms, 0s;
@@ -73,13 +73,22 @@ findbar[hidden] {
   list-style-image: url("chrome://global/skin/icons/loading_16.png");
 }
 
+.findbar-textbox {
+  -moz-appearance: none;
+  border: 1px solid ThreeDShadow;
+  box-shadow: 0 0 1px 0 ThreeDShadow inset;
+  margin: 0;
+  padding: 5px;
+  width: 14em;
+}
+
 .findbar-textbox[status="notfound"] {
-  box-shadow: 0 0 0 1em #f66 inset;
+  background-color: #f66;
   color: white;
 }
 
 .findbar-textbox[flash="true"] {
-  box-shadow: 0 0 0 1em yellow inset;
+  background-color: yellow;
   color: black;
 }
 
diff --git a/toolkit/themes/osx/global/findBar.css b/toolkit/themes/osx/global/findBar.css
index 44983d80f..869a62432 100644
--- a/toolkit/themes/osx/global/findBar.css
+++ b/toolkit/themes/osx/global/findBar.css
@@ -196,6 +196,7 @@ label.findbar-find-fast:-moz-lwtheme,
 
 .findbar-textbox[flash="true"] {
   background-color: #F7E379;
+  color: #000;
 }
 
 .findbar-textbox[status="notfound"] {
diff --git a/toolkit/themes/windows/global/findBar.css b/toolkit/themes/windows/global/findBar.css
index 34b3ae49b..ecb1b2db1 100644
--- a/toolkit/themes/windows/global/findBar.css
+++ b/toolkit/themes/windows/global/findBar.css
@@ -15,7 +15,8 @@
 }
 
 findbar {
-  padding-top: 1px;
+  padding: 4px 2px;
+  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;
@@ -108,13 +109,22 @@ findbar[hidden] {
   list-style-image: url("chrome://global/skin/icons/information-16.png");
 }
 
+.findbar-textbox {
+  -moz-appearance: none;
+  border: 1px solid ThreeDShadow;
+  border-radius: 2px;
+  margin: 0;
+  padding: 1px 5px;
+  width: 14em;
+}
+
 .findbar-textbox[status="notfound"] {
-  box-shadow: 0 0 0 1em #f66 inset;
+  background-color: #f66;
   color: white;
 }
 
 .findbar-textbox[flash="true"] {
-  box-shadow: 0 0 0 1em yellow inset;
+  background-color: yellow;
   color: black;
 }