--- a/toolkit/modules/FinderHighlighter.jsm
+++ b/toolkit/modules/FinderHighlighter.jsm
@@ -32,31 +32,41 @@ const kFontPropsCamelCase = kFontPropsCS
let parts = prop.split("-");
return parts.shift() + parts.map(part => part.charAt(0).toUpperCase() + part.slice(1)).join("");
});
const kRGBRE = /^rgba?\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*/i;
// This uuid is used to prefix HTML element IDs in order to make them unique and
// hard to clash with IDs content authors come up with.
const kModalIdPrefix = "cedee4d0-74c5-4f2d-ab43-4d37c0f9d463";
const kModalOutlineId = kModalIdPrefix + "-findbar-modalHighlight-outline";
+const kOutlineBoxColor = "255,197,53";
const kModalStyles = {
outlineNode: [
- ["position", "absolute"],
- ["background", "#ffc535"],
+ ["-moz-border-top-colors", `rgba(${kOutlineBoxColor},.1) rgba(${kOutlineBoxColor},.4) rgba(${kOutlineBoxColor},.7)`],
+ ["-moz-border-right-colors", `rgba(${kOutlineBoxColor},.1) rgba(${kOutlineBoxColor},.4) rgba(${kOutlineBoxColor},.7)`],
+ ["-moz-border-bottom-colors", `rgba(${kOutlineBoxColor},.1) rgba(${kOutlineBoxColor},.4) rgba(${kOutlineBoxColor},.7)`],
+ ["-moz-border-left-colors", `rgba(${kOutlineBoxColor},.1) rgba(${kOutlineBoxColor},.4) rgba(${kOutlineBoxColor},.7)`],
+ ["background-color", `rgb(${kOutlineBoxColor})`],
+ ["background-clip", "padding-box"],
+ ["border", `2px solid rgba(${kOutlineBoxColor},.4)`],
["border-radius", "3px"],
["box-shadow", "0 2px 0 0 rgba(0,0,0,.1)"],
["color", "#000"],
["display", "-moz-box"],
["margin", "-2px 0 0 -2px !important"],
- ["padding", "2px !important"],
+ ["overflow", "hidden"],
["pointer-events", "none"],
+ ["position", "absolute"],
["white-space", "nowrap"],
["will-change", "transform"],
["z-index", 2]
],
+ outlineNodeBrightText: [
+ ["border", `2px solid rgba(${kOutlineBoxColor},.6)`],
+ ],
outlineNodeDebug: [ ["z-index", 2147483647] ],
outlineText: [
["margin", "0 !important"],
["padding", "0 !important"],
["vertical-align", "top !important"]
],
maskNode: [
["background", "rgba(0,0,0,.35)"],
@@ -940,17 +950,18 @@ FinderHighlighter.prototype = {
// text is set to the current textContent for the matching rect.
let text = (i == rectCount - 1) ? textContent.slice(i).join(" ") : textContent[i];
++i;
let outlineStyle = this._getStyleString(kModalStyles.outlineNode, [
["top", rect.top + "px"],
["left", rect.left + "px"],
["height", rect.height + "px"],
["width", rect.width + "px"]
- ], kDebug ? kModalStyles.outlineNodeDebug : []);
+ ], kDebug ? kModalStyles.outlineNodeDebug : [],
+ dict.brightText ? kModalStyles.outlineNodeBrightText : []);
fontStyle.lineHeight = rect.height + "px";
let textStyle = this._getStyleString(kModalStyles.outlineText) + "; " +
this._getHTMLFontStyle(fontStyle);
if (rebuildOutline) {
let textBoxParent = (rectCount == 1) ? outlineBox :
outlineBox.appendChild(document.createElementNS(kNSHTML, "div"));
textBoxParent.setAttribute("style", outlineStyle);