Adds text/image/both modes for the main toolbar. Bug 22056, patch by

neil@parkwaycc.co.uk, r=timeless, sr=bzbarsky, moa=blake,hyatt

suite/themes/classic/communicator/brand.css

@@ -56,11 +56,15 @@
   list-style-image: url("chrome://communicator/skin/brand/throbber-anim.gif");
 }
   
+#navigator-throbber[buttonstyle="text"],
+#navigator-throbber[buttonstyle="pictures"],
 #navigator-throbber[toolbarmode="small"] {
-  margin: 0 5px 0 0;
+  margin: 0 5px;
   list-style-image: url("chrome://communicator/skin/brand/throbber16-single.gif");
 }
 
+#navigator-throbber[buttonstyle="text"][busy="true"],
+#navigator-throbber[buttonstyle="pictures"][busy="true"],
 #navigator-throbber[toolbarmode="small"][busy="true"] {
   list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.gif");
 }

suite/themes/classic/communicator/button.css

@@ -61,6 +61,23 @@
   display: none;
 }
 
+.toolbarbutton-1[buttonstyle="pictures"],
+.toolbarbutton-1[buttonstyle="pictures"] > .toolbarbutton-menubutton-button {
+  min-width: 0px;
+}
+
+.toolbarbutton-1[buttonstyle="pictures"] > .toolbarbutton-menubutton-button
+    > .toolbarbutton-text,
+.toolbarbutton-1[buttonstyle="pictures"] > .toolbarbutton-text {
+  display: none;
+}
+
+.toolbarbutton-1[buttonstyle="text"] > .toolbarbutton-menubutton-button
+    > .toolbarbutton-icon,
+.toolbarbutton-1[buttonstyle="text"] > .toolbarbutton-icon {
+  display: none;
+}
+
 /* ::::: standard toolbar buttons ::::: */
 
 .button-toolbar {

suite/themes/classic/navigator/navigator.css

@@ -150,15 +150,22 @@
   display: none;
 }
 
-#nav-bar[toolbarmode="small"] > #nav-bar-inner {
-  margin: 0;
-  border: none;
+.toolbarbutton-1[toolbarmode="small"] > .toolbarbutton-menubutton-button
+    > .toolbarbutton-icon,
+.toolbarbutton-1[toolbarmode="small"] > .toolbarbutton-icon {
+  display: inline;
 }
 
 #nav-bar[toolbarmode="small"] > .toolbar-primary-grippy {
   display: none;
 }
 
+.toolbarbutton-1[buttonstyle="text"] > .toolbarbutton-menubutton-button
+    > .toolbarbutton-text,
+.toolbarbutton-1[buttonstyle="text"] > .toolbarbutton-text {
+  padding: 4px 0;
+}
+
 /* ::::: fullscreen window controls ::::: */
 
 #window-controls {
@@ -185,7 +192,6 @@
 #nav-bar-inner {
   -moz-box-align: center;
   min-width: 0px;
-  margin: 4px 6px;
 }
 
 #urlbar {

suite/themes/modern/communicator/brand.css

@@ -68,11 +68,13 @@
   background: url("chrome://communicator/skin/toolbar/prtb-bg-noline.gif") #B1BDC9 repeat-x top;
 }
 
+#navigator-throbber[buttonstyle="text"],
 #navigator-throbber[toolbarmode="small"] {
-  margin: 0 5px 0 0;
+  margin: 0 5px;
   list-style-image: url("chrome://communicator/skin/brand/throbber16-single.gif");
 }
 
+#navigator-throbber[buttonstyle="text"][busy="true"],
 #navigator-throbber[toolbarmode="small"][busy="true"] {
   list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.gif");
 }

suite/themes/modern/communicator/button.css

@@ -82,6 +82,28 @@
   display: none;
 }
 
+.toolbarbutton-1[buttonstyle="pictures"] > stack > .toolbarbutton-menubutton-button 
+  > .toolbarbutton-text,
+.toolbarbutton-1[buttonstyle="pictures"] > .toolbarbutton-text {
+  display: none;
+}
+
+.toolbarbutton-1[buttonstyle="text"] > stack > .toolbarbutton-menubutton-button 
+  > .toolbarbutton-icon,
+.toolbarbutton-1[buttonstyle="text"] > .toolbarbutton-icon {
+  display: none;
+}
+
+.toolbarbutton-1[buttonstyle="pictures"] > .toolbarbutton-menubutton-stack
+    > .toolbarbutton-menubutton-dropmarker {
+  margin: 20px 0px 0px 40px;
+}
+
+.toolbarbutton-1[buttonstyle="text"] > .toolbarbutton-menubutton-stack
+    > .toolbarbutton-menubutton-dropmarker {
+  margin: 8px 0px 0px 40px;
+}
+
 /* ::::: standard toolbar buttons ::::: */
  
 .button-toolbar {

suite/themes/modern/communicator/toolbar.css

@@ -45,7 +45,6 @@
 
 .toolbar-primary {
   -moz-binding: url("chrome://communicator/skin/toolbar/toolbarBindings.xml#toolbar-primary");
-  min-height: 45px;
   background-color: #B1BDC9;
 }
 
@@ -64,9 +63,15 @@
   background-position: top;
 }
 
+.toolbar-primary[buttonstyle="pictures"] > .toolbar-primary-holder > .toolbar-primary-icon,
+.toolbar-primary[buttonstyle="text"] > .toolbar-primary-holder > .toolbar-primary-icon {
+  display: none;
+}
+
 /* ::::: toolbargrippy ::::: */
  
 .toolbar-primary-grippy { 
+  -moz-binding: url("chrome://communicator/skin/toolbar/toolbarBindings.xml#toolbargrippy-primary");
   border: none;
   background: url("chrome://communicator/skin/toolbar/prtb-grip-mid.gif") repeat-y;
   list-style-image: url("chrome://communicator/skin/toolbar/prtb-grip-btm.gif");
@@ -74,8 +79,8 @@
 
 .toolbar-primary-grippy > .toolbargrippy-texture {
   width: 13px;
-  height: 34px;
-  background: url("chrome://communicator/skin/toolbar/prtb-grip-top.gif") no-repeat top;
+  height: 0px;
+  list-style-image: url("chrome://communicator/skin/toolbar/prtb-grip-top.gif");
 }
 
 .toolbar-primary-grippy > .toolbargrippy-arrow {
@@ -91,7 +96,7 @@
 }
 
 .toolbar-primary-grippy:hover:active > .toolbargrippy-texture {
-  background-image: url("chrome://communicator/skin/toolbar/prtb-grip-top-act.gif");
+  list-style-image: url("chrome://communicator/skin/toolbar/prtb-grip-top-act.gif");
 }
 
 /* ::::: toolbar-primary separator ::::: */

suite/themes/modern/communicator/toolbar/toolbarBindings.xml

@@ -6,7 +6,7 @@
           xmlns:xbl="http://www.mozilla.org/xbl">
 
   <binding id="toolbar-primary"
-           extends="chrome://global/content/bindings/toolbar.xml#toolbar">
+           extends="chrome://global/content/bindings/toolbar.xml#toolbar-primary">
     <content>
       <xul:toolbargrippy xbl:inherits="last-toolbar"
           tbattr="toolbar-grippy" class="toolbar-primary-grippy"/>
@@ -22,8 +22,8 @@
   <binding id="toolbargrippy-primary"
            extends="chrome://global/content/bindings/toolbar.xml#toolbargrippy">
     <content>
-      <xul:spacer class="toolbargrippy-primary-top" flex="1"/>
-      <xul:spacer class="toolbargrippy-primary-btm"/>
+      <xul:image class="toolbargrippy-arrow"/>
+      <xul:image class="toolbargrippy-texture" flex="1"/>
     </content>
   </binding>
 

suite/themes/modern/navigator/navigator.css

@@ -142,7 +142,13 @@
 .toolbarbutton-1 > stack > .toolbarbutton-menubutton-button 
   > .toolbarbutton-text,
 .toolbarbutton-1 > .toolbarbutton-text {
-  display: none;
+  display: none !important;
+}
+
+.toolbarbutton-1 > stack > .toolbarbutton-menubutton-button 
+  > .toolbarbutton-icon,
+.toolbarbutton-1 > .toolbarbutton-icon {
+  display: inline !important;
 }
 
 /* ::::: small primary toolbar buttons ::::: */