Bug 1455922 - Adjust findbar style to work better on dark themes. r=dao
MozReview-Commit-ID: IGIFlJUV1V8
--- a/toolkit/themes/osx/global/findBar.css
+++ b/toolkit/themes/osx/global/findBar.css
@@ -69,16 +69,19 @@ label.findbar-find-fast:-moz-lwtheme,
.findbar-textbox,
.findbar-find-next {
border-radius: 10000px;
}
}
.findbar-textbox {
border: @roundButtonBorderWidth@ @roundButtonBorderStyle@ var(--lwt-toolbar-field-border-color, @roundButtonBorderColor@);
+ -moz-context-properties: fill, fill-opacity;
+ fill: currentColor;
+ fill-opacity: 0.8;
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"] {
--- a/toolkit/themes/osx/global/icons/search-textbox.svg
+++ b/toolkit/themes/osx/global/icons/search-textbox.svg
@@ -1,7 +1,6 @@
-<?xml version="1.0" encoding="UTF-8"?>
<!-- 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/. -->
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
- <path fill="#939393" fill-rule="evenodd" d="M11.354,10.646l-0.707.707L7.295,8A4.483,4.483,0,1,1,9,4.5,4.458,4.458,0,0,1,8,7.295ZM4.5,1A3.5,3.5,0,1,0,8,4.5,3.5,3.5,0,0,0,4.5,1Z"/>
-</svg>
\ No newline at end of file
+ <path fill="context-fill" fill-opacity="context-fill-opacity" d="M11.354,10.646l-0.707.707L7.295,8A4.483,4.483,0,1,1,9,4.5,4.458,4.458,0,0,1,8,7.295ZM4.5,1A3.5,3.5,0,1,0,8,4.5,3.5,3.5,0,0,0,4.5,1Z"/>
+</svg>
--- a/toolkit/themes/shared/findBar.inc.css
+++ b/toolkit/themes/shared/findBar.inc.css
@@ -69,34 +69,35 @@ findbar[noanim] {
border-bottom-left-radius: 0;
}
.findbar-textbox[focused="true"] {
border-color: Highlight;
}
.findbar-textbox[status="notfound"] {
- background-color: #f66;
- color: white;
+ background-color: rgba(255,0,57,.3);
+ color: inherit;
}
.findbar-textbox[flash="true"] {
- background-color: yellow;
- color: black;
+ background-color: rgba(255,233,0,.3);
+ color: inherit;
}
.findbar-textbox.minimal {
border-radius: 2px;
}
.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));
+ background: linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,.1));
+ background-clip: padding-box;
border: 1px solid ThreeDShadow;
padding: 2px 5px;
line-height: 1em;
-moz-context-properties: fill;
fill: currentColor;
color: inherit;
}