Bug 1059432 - UI updates for frame selection command button. r=ochameau
authorBrian Grinstead <bgrinstead@mozilla.com>
Wed, 27 Aug 2014 12:00:00 -0400
changeset 223818 3fa315846f97505fb1d42c4b4cbbac1d694782ce
parent 223817 8883019fca40023d4f5d6941491d03f3e339dd10
child 223819 de171b8c382b16afb9849255fb18113991608b2a
push id3979
push userraliiev@mozilla.com
push dateMon, 13 Oct 2014 16:35:44 +0000
treeherdermozilla-beta@30f2cc610691 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersochameau
bugs1059432
milestone34.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 1059432 - UI updates for frame selection command button. r=ochameau
browser/themes/shared/devtools/toolbars.inc.css
--- a/browser/themes/shared/devtools/toolbars.inc.css
+++ b/browser/themes/shared/devtools/toolbars.inc.css
@@ -80,16 +80,25 @@
 }
 
 #toolbox-buttons .devtools-toolbarbutton[text-as-image] {
   -moz-padding-start: 5px;
   -moz-padding-end: 5px;
   min-width: inherit;
 }
 
+/* Command buttons with menupopups should be styled slightly differently -
+   no background color and a bit more narrow */
+#toolbox-buttons .devtools-toolbarbutton:not([text-as-image]):not(:hover):not([open=true]) {
+  background: transparent;
+}
+#toolbox-buttons .devtools-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker {
+  padding: 0 2px;
+}
+
 .devtools-toolbarbutton:not([label]) > .toolbarbutton-text {
   display: none;
 }
 
 .devtools-toolbar .devtools-toolbarbutton {
   border-width: 0;
 }
 
@@ -562,16 +571,19 @@
   background-position: -16px center;
 }
 .command-button:hover:active > image {
   background-position: -32px center;
 }
 .command-button[checked=true] > image {
   background-position: -48px center;
 }
+.command-button[open=true] > image {
+  background-position: 0 center;
+}
 
 #command-button-paintflashing > image {
   background-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
 }
 
 #command-button-screenshot > image {
   background-image: url("chrome://browser/skin/devtools/command-screenshot.png");
 }