Bug 969458 - Apply the SVG fade-out mask only to toolbarbuttons with long enough labels. r=jaws

browser/components/customizableui/content/panelUI.xml

@@ -266,18 +266,25 @@
             // Shouldn't act on e.g. context menus being shown from within the panel.
             return;
           }
-          switch(aEvent.type) {
+          switch (aEvent.type) {
             case "click":
               if (aEvent.originalTarget == this._clickCapturer) {
                 this.showMainView();
               }
               break;
             case "overflow":
-              // Resize the right view on the next tick.
-              if (this.showingSubView) {
-                setTimeout(this._syncContainerWithSubView.bind(this), 0);
-              } else if (!this.transitioning) {
-                setTimeout(this._syncContainerWithMainView.bind(this), 0);
+              switch (aEvent.target.localName) {
+                case "vbox":
+                  // Resize the right view on the next tick.
+                  if (this.showingSubView) {
+                    setTimeout(this._syncContainerWithSubView.bind(this), 0);
+                  } else if (!this.transitioning) {
+                    setTimeout(this._syncContainerWithMainView.bind(this), 0);
+                  }
+                  break;
+                case "toolbarbutton":
+                  aEvent.target.setAttribute("fadelabel", "true");
+                  break;
               }
               break;
             case "popupshowing":

browser/themes/shared/customizableui/panelUIOverlay.inc.css

@@ -118,14 +118,13 @@
   padding: 0;
 }
 
-.panelUI-grid .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
+.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-multiline-text {
   -moz-hyphens: auto;
-  min-height: 3.5em;
 }
 
-.panelUI-grid:not([customize-transitioning]) .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
-.panelUI-grid:not([customize-transitioning]) .toolbarbutton-1 > .toolbarbutton-multiline-text {
+.panelUI-grid:not([customize-transitioning]) .toolbarbutton-1[fadelabel] > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
+.panelUI-grid:not([customize-transitioning]) .toolbarbutton-1[fadelabel] > .toolbarbutton-multiline-text {
   mask: url(chrome://browser/content/browser.xul#menuPanelButtonTextFadeOutMask);
 }
 
@@ -135,7 +134,7 @@
   margin: 2px 0 0;
 }
 
-.panelUI-grid .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text {
+.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text {
   text-align: center;
   margin: -1px 0 0;
 }