diff --git a/browser/base/content/browser.xul b/browser/base/content/browser.xul index 5519b06568e..45e54494a7f 100644 --- a/browser/base/content/browser.xul +++ b/browser/base/content/browser.xul @@ -1003,8 +1003,6 @@ #endif .toolbarbutton-text { + display: none; +} diff --git a/browser/devtools/highlighter/inspector.jsm b/browser/devtools/highlighter/inspector.jsm index 9dae75eb867..fcad0ea1ada 100644 --- a/browser/devtools/highlighter/inspector.jsm +++ b/browser/devtools/highlighter/inspector.jsm @@ -104,6 +104,15 @@ function InspectorUI(aWindow) this.toolEvents = {}; this.store = new InspectorStore(); this.INSPECTOR_NOTIFICATIONS = INSPECTOR_NOTIFICATIONS; + + // Set the tooltip of the inspect button. + let keysbundle = Services.strings.createBundle( + "chrome://global/locale/keys.properties"); + let returnString = keysbundle.GetStringFromName("VK_RETURN"); + let tooltip = this.strings.formatStringFromName("inspectButton.tooltiptext", + [returnString], 1); + let button = this.chromeDoc.getElementById("inspector-inspect-toolbutton"); + button.setAttribute("tooltiptext", tooltip); } InspectorUI.prototype = { diff --git a/browser/locales/en-US/chrome/browser/browser.dtd b/browser/locales/en-US/chrome/browser/browser.dtd index 9a761155fb2..036c26dfcb1 100644 --- a/browser/locales/en-US/chrome/browser/browser.dtd +++ b/browser/locales/en-US/chrome/browser/browser.dtd @@ -213,8 +213,6 @@ can reach it easily. --> - - diff --git a/browser/locales/en-US/chrome/browser/devtools/inspector.properties b/browser/locales/en-US/chrome/browser/devtools/inspector.properties index b815d2552d5..132b8eeb5a6 100644 --- a/browser/locales/en-US/chrome/browser/devtools/inspector.properties +++ b/browser/locales/en-US/chrome/browser/devtools/inspector.properties @@ -25,3 +25,10 @@ breadcrumbs.siblings=Siblings ruleView.label=Rules ruleView.accesskey=R ruleView.tooltiptext=View and Edit CSS + +# LOCALIZATION NOTE (inspectButton.tooltiptext): +# This button appears in the Inspector Toolbar. inspectButton is stateful, +# if it's pressed users can select an element with the mouse. Pressing the +# "Return" key # changes that state. %S is the keyboard shortcut (VK_RETURN in +# chrome://global/locale/keys.properties). +inspectButton.tooltiptext=Select element with mouse (%S) diff --git a/browser/themes/gnomestripe/browser.css b/browser/themes/gnomestripe/browser.css index 49d6d673f92..26c34e5c49f 100644 --- a/browser/themes/gnomestripe/browser.css +++ b/browser/themes/gnomestripe/browser.css @@ -1988,6 +1988,15 @@ panel[dimmed="true"] { /* Highlighter toolbar */ +#inspector-inspect-toolbutton { + list-style-image: url("chrome://browser/skin/devtools/inspect-button.png"); + -moz-image-region: rect(0px 16px 16px 0px); +} + +#inspector-inspect-toolbutton[checked] { + -moz-image-region: rect(0px 32px 16px 16px); +} + #inspector-toolbar { border-top: 1px solid hsla(210, 8%, 5%, .65); } diff --git a/browser/themes/gnomestripe/devtools/common.css b/browser/themes/gnomestripe/devtools/common.css index 6adb9179618..98a6991525a 100644 --- a/browser/themes/gnomestripe/devtools/common.css +++ b/browser/themes/gnomestripe/devtools/common.css @@ -57,6 +57,10 @@ margin: 0 3px; } +.devtools-toolbarbutton:not([label]) { + min-width: 32px; +} + .devtools-toolbarbutton:not([checked]):hover:active { border-color: hsla(210,8%,5%,.6); background: -moz-linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3)); diff --git a/browser/themes/gnomestripe/devtools/inspect-button.png b/browser/themes/gnomestripe/devtools/inspect-button.png new file mode 100644 index 00000000000..ebfd9586d20 Binary files /dev/null and b/browser/themes/gnomestripe/devtools/inspect-button.png differ diff --git a/browser/themes/gnomestripe/jar.mn b/browser/themes/gnomestripe/jar.mn index aaabfdde100..f716b705730 100644 --- a/browser/themes/gnomestripe/jar.mn +++ b/browser/themes/gnomestripe/jar.mn @@ -129,6 +129,7 @@ browser.jar: skin/classic/browser/devtools/itemToggle.png (devtools/itemToggle.png) skin/classic/browser/devtools/itemArrow-rtl.png (devtools/itemArrow-rtl.png) skin/classic/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png) + skin/classic/browser/devtools/inspect-button.png (devtools/inspect-button.png) #ifdef MOZ_SERVICES_SYNC skin/classic/browser/sync-16-throbber.png skin/classic/browser/sync-16.png diff --git a/browser/themes/pinstripe/browser.css b/browser/themes/pinstripe/browser.css index f5ba4f3e2c3..1a116b8d378 100644 --- a/browser/themes/pinstripe/browser.css +++ b/browser/themes/pinstripe/browser.css @@ -2721,6 +2721,15 @@ panel[dimmed="true"] { /* Highlighter toolbar */ +#inspector-inspect-toolbutton { + list-style-image: url("chrome://browser/skin/devtools/inspect-button.png"); + -moz-image-region: rect(0px 16px 16px 0px); +} + +#inspector-inspect-toolbutton[checked] { + -moz-image-region: rect(0px 32px 16px 16px); +} + #inspector-toolbar { border-top: 1px solid hsla(210, 8%, 5%, .65); padding-top: 4px; diff --git a/browser/themes/pinstripe/devtools/common.css b/browser/themes/pinstripe/devtools/common.css index fc8679ccd52..6eee51895a7 100644 --- a/browser/themes/pinstripe/devtools/common.css +++ b/browser/themes/pinstripe/devtools/common.css @@ -62,6 +62,10 @@ margin: 1px 6px; } +.devtools-toolbarbutton:not([label]) { + min-width: 32px; +} + .devtools-toolbarbutton:not([checked]):hover:active { border-color: hsla(210,8%,5%,.6); background: -moz-linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3)); diff --git a/browser/themes/pinstripe/devtools/inspect-button.png b/browser/themes/pinstripe/devtools/inspect-button.png new file mode 100644 index 00000000000..ebfd9586d20 Binary files /dev/null and b/browser/themes/pinstripe/devtools/inspect-button.png differ diff --git a/browser/themes/pinstripe/jar.mn b/browser/themes/pinstripe/jar.mn index 95987071c55..d40d953abc9 100644 --- a/browser/themes/pinstripe/jar.mn +++ b/browser/themes/pinstripe/jar.mn @@ -170,6 +170,7 @@ browser.jar: skin/classic/browser/devtools/itemArrow-rtl.png (devtools/itemArrow-rtl.png) skin/classic/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png) skin/classic/browser/devtools/background-noise-toolbar.png (devtools/background-noise-toolbar.png) + skin/classic/browser/devtools/inspect-button.png (devtools/inspect-button.png) #ifdef MOZ_SERVICES_SYNC skin/classic/browser/sync-throbber.png skin/classic/browser/sync-16.png diff --git a/browser/themes/winstripe/browser.css b/browser/themes/winstripe/browser.css index 4ef9d529b77..b232c7efb69 100644 --- a/browser/themes/winstripe/browser.css +++ b/browser/themes/winstripe/browser.css @@ -2683,6 +2683,15 @@ panel[dimmed="true"] { /* Highlighter toolbar */ +#inspector-inspect-toolbutton { + list-style-image: url("chrome://browser/skin/devtools/inspect-button.png"); + -moz-image-region: rect(0px 16px 16px 0px); +} + +#inspector-inspect-toolbutton[checked] { + -moz-image-region: rect(0px 32px 16px 16px); +} + #inspector-toolbar { border-top: 1px solid hsla(211,68%,6%,.65) !important; } diff --git a/browser/themes/winstripe/devtools/common.css b/browser/themes/winstripe/devtools/common.css index 85c0ba7ebf1..cb09a7c9468 100644 --- a/browser/themes/winstripe/devtools/common.css +++ b/browser/themes/winstripe/devtools/common.css @@ -61,6 +61,10 @@ margin: 0; } +.devtools-toolbarbutton:not([label]) { + min-width: 32px; +} + .devtools-toolbarbutton:not([checked]):hover:active { background-color: hsla(210,18%,9%,.1); background-image: -moz-linear-gradient(hsla(209,13%,54%,.35), hsla(209,13%,54%,.1) 85%, hsla(209,13%,54%,.2)); diff --git a/browser/themes/winstripe/devtools/inspect-button.png b/browser/themes/winstripe/devtools/inspect-button.png new file mode 100644 index 00000000000..ebfd9586d20 Binary files /dev/null and b/browser/themes/winstripe/devtools/inspect-button.png differ diff --git a/browser/themes/winstripe/jar.mn b/browser/themes/winstripe/jar.mn index e5d860334d2..c3bf5b008c1 100644 --- a/browser/themes/winstripe/jar.mn +++ b/browser/themes/winstripe/jar.mn @@ -154,6 +154,7 @@ browser.jar: skin/classic/browser/devtools/itemToggle.png (devtools/itemToggle.png) skin/classic/browser/devtools/itemArrow-rtl.png (devtools/itemArrow-rtl.png) skin/classic/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png) + skin/classic/browser/devtools/inspect-button.png (devtools/inspect-button.png) #ifdef MOZ_SERVICES_SYNC skin/classic/browser/sync-throbber.png skin/classic/browser/sync-16.png @@ -323,6 +324,7 @@ browser.jar: skin/classic/aero/browser/devtools/itemToggle.png (devtools/itemToggle.png) skin/classic/aero/browser/devtools/itemArrow-rtl.png (devtools/itemArrow-rtl.png) skin/classic/aero/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png) + skin/classic/aero/browser/devtools/inspect-button.png (devtools/inspect-button.png) #ifdef MOZ_SERVICES_SYNC skin/classic/aero/browser/sync-throbber.png skin/classic/aero/browser/sync-16.png