trying to fit in menubuttons better

diff --git a/EarlyBlue/communicator/skin/menubutton.css b/EarlyBlue/communicator/skin/menubutton.css
index 129a1a3e0cf8bdab998f4a8ebc4cf8cb09c5fe0e..ed0c2c406b7839278a886713ed6c3aeea19bcffa 100755 (executable)
--- a/EarlyBlue/communicator/skin/menubutton.css
+++ b/EarlyBlue/communicator/skin/menubutton.css
@@ -59,79 +59,122 @@
  **/
 
 
+/* This is really a hack to deal with buggy :hover - but it's now in toolkit (see below, taken from classic) */
+
+/**
+ * XXX - this is a hack. :hover does not work to spec and so we're using a binding
+ *       with JS that lives in xpfe/global/resources/content/menulistBindings.xml
+ *       to set attributes on various parts of the button when mouse down/over 
+ *       events fire. When :hover works correctly, this can be removed (see
+ *       revision 1.21 of this file for details.
+ */
+
+
 .menubutton-dual.top
+  {
+    -moz-binding          : url("chrome://global/content/menulistBindings.xml#menubutton-dual-ex");
+/*    -moz-user-focus       : ignore !important; */
+  }
+
+.menubutton-dual.left
+  {
+    -moz-binding          : url("chrome://global/content/menulistBindings.xml#menubutton-dual-ex-left");
+/*    -moz-user-focus       : none !important; */
+  }  
+  
+
+
+.menubutton-dual
   {
     font-size               : smaller;
   }
 
-.menubutton-dual.top > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box > .button-text-container 
+.menubutton-dual-ex-button > .button-internal-box > .button-text-container 
   {
     padding-top             : 3px;
     text-align              : center;
   }
 
-.menubutton-dual.top > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box
+
+
+.menubutton-dual > .menubutton-dual-ex-button > .button-internal-box
   {
     border                  : 1px solid transparent;
     padding                 : 1px;
   }
 
-.menubutton-dual.top:hover > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,
-.menubutton-dual.top > .menubutton-internal-box > .menubutton-dual-button:hover > .button-internal-box
+.menubutton-dual-ex-button
+  {
+    margin                  : 0px;
+  }
+
+.menubutton-dual:hover > .menubutton-dual-ex-button > .button-internal-box,
+.menubutton-dual[buttonover="true"] > .menubutton-dual-ex-button > .button-internal-box
   {
     border                  : 1px outset #CCD0DD;
     padding                 : 1px;
   }
 
-.menubutton-dual.top:hover:active > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,
-.menubutton-dual.top[open="true"] > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,
-.menubutton-dual.top > .menubutton-internal-box > .menubutton-dual-button:hover:active > .button-internal-box
+.menubutton-dual:hover:active > .menubutton-dual-ex-button > .button-internal-box,
+.menubutton-dual[open="true"] > .menubutton-dual-ex-button > .button-internal-box,
+.menubutton-dual > .menubutton-dual-ex-button:hover:active > .button-internal-box
   {
     border                  : 1px inset #CCD0DD;
     padding                 : 2px 0px 0px 2px;
   }
 
 
-.menubutton-dual.top[disabled="true"] > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,
-.menubutton-dual.top[disabled="true"]:hover:active > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,
-.menubutton-dual.top[disabled="true"][open="true"] > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,
-.menubutton-dual.top[disabled="true"] > .menubutton-internal-box > .menubutton-dual-button:hover:active > .button-internal-box
+.menubutton-dual[disabled="true"] > .menubutton-dual-ex-button > .button-internal-box,
+.menubutton-dual[disabled="true"]:hover:active > .menubutton-dual-ex-button > .button-internal-box,
+.menubutton-dual[disabled="true"][open="true"] > .menubutton-dual-ex-button > .button-internal-box,
+.menubutton-dual[disabled="true"][buttonover="true"] > .menubutton-dual-ex-button > .button-internal-box,
+.menubutton-dual[disabled="true"] > .menubutton-dual-ex-button:hover:active > .button-internal-box
   {
     border                  : 1px solid transparent;
     padding                 : 1px;
   }
 
-.menubutton-dual.top > .menubutton-internal-box > .menubutton-dual-dropmarker-box
+
+  
+.menubutton-dual > .menubutton-dual-dropmarker-box
   {
     border                  : 1px solid transparent;
     padding                 : 1px;
   }
 
-.menubutton-dual.top:hover > .menubutton-internal-box > .menubutton-dual-dropmarker-box
+.menubutton-dual-ex:hover > .menubutton-dual-dropmarker-box,
+.menubutton-dual:hover > .menubutton-dual-dropmarker-box,
+.menubutton-dual > .menubutton-dual-dropmarker-box:hover,
+.menubutton-dual[buttonover="true"] > .menubutton-dual-dropmarker-box
   {
     border                  : 1px outset #CCD0DD;
     padding                 : 1px;
   }
 
-.menubutton-dual.top:hover:active > .menubutton-internal-box > .menubutton-dual-dropmarker-box,
-.menubutton-dual.top[open="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box
+.menubutton-dual:hover:active > .menubutton-dual-dropmarker-box,
+.menubutton-dual[open="true"] > .menubutton-dual-dropmarker-box
   {
     border                  : 1px inset #CCD0DD;
     padding                 : 2px 0px 0px 2px;
   }
 
 
-.menubutton-dual.top[disabled="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box,
-.menubutton-dual.top[disabled="true"]:hover:active > .menubutton-internal-box > .menubutton-dual-dropmarker-box,
-.menubutton-dual.top[disabled="true"][open="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box
+.menubutton-dual[disabled="true"] > .menubutton-dual-dropmarker-box,
+.menubutton-dual[disabled="true"]:hover:active > .menubutton-dual-dropmarker-box,
+.menubutton-dual[disabled="true"][open="true"] > .menubutton-dual-dropmarker-box,
+.menubutton-dual[disabled="true"][buttonover="true"] > .menubutton-dual-dropmarker-box
   {
     border                  : 1px solid transparent;
     padding                 : 1px;
   }
 
-menubutton > .menubutton-internal-box > .menubutton-dual-dropmarker-box > .menubutton-dropmarker
+
+menubutton > .menubutton-dual-dropmarker-box > .menubutton-dropmarker
   {
 /*    padding-bottom           : 17px;  */
     padding-bottom           : 24px;  
   }
 
+
+
+

diff --git a/EarlyBlue/global/skin/menubutton.css b/EarlyBlue/global/skin/menubutton.css
index a8e0db3689fc774758528693691da3e94059c1e2..ccbca60651fe6e364403303d3e7c7d6583e518ad 100755 (executable)
--- a/EarlyBlue/global/skin/menubutton.css
+++ b/EarlyBlue/global/skin/menubutton.css
@@ -1,126 +1,130 @@
-\r
-/* outermost frame */\r
-  menubutton\r
-    {\r
-/*      margin              : 3px 5px 3px 5px; */\r
-    }\r
-    \r
-  menubutton[disabled="true"] \r
-    {\r
-      color               : #999999;\r
-    }\r
-  \r
-  menubutton > .menubutton-internal-box\r
-    {\r
-      border              : none;\r
-      padding             : 0px;\r
-      vertical-align      : middle;\r
-    }\r
-\r
-  .menubutton-single-icon\r
-    {\r
-      margin-right        : 3px;\r
-    }\r
-    \r
-/** "Dual Functionality" menubutton\r
- *  Has a popup spawning button and a command invoking button, e.g. back/forward\r
- *  class="menubutton-dual"\r
- **/    \r
-  \r
-/* inner button */\r
-\r
-  menubutton > .menubutton-internal-box > .menubutton-dual-button,\r
-  menubutton:hover > .menubutton-internal-box > .menubutton-dual-button,\r
-  menubutton:active > .menubutton-internal-box > .menubutton-dual-button\r
-    {\r
-      border              : none;\r
-      margin              : 0px;\r
-      -moz-border-radius  : 0px;\r
-    }\r
-\r
-  menubutton > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,\r
-    {\r
-      border              : 1px outset #CCD0DD;\r
-      margin              : 0px\r
-    }\r
-    \r
-  menubutton[open="true"] > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,\r
-  menubutton > .menubutton-internal-box > .menubutton-dual-button:hover:active > .button-internal-box,\r
-  menubutton:hover:active > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box\r
-    {\r
-      border              : 1px inset #CCD0DD;\r
-    }\r
-    \r
-  menubutton[disabled="true"] > .menubutton-internal-box > .menubutton-dual-button:hover:active > .button-internal-box\r
-    {\r
-      border              : 1px outset #CCD0DD;\r
-    }\r
-\r
-\r
-/* inner dropmarker */\r
-  menubutton > .menubutton-internal-box > .menubutton-dual-dropmarker-box\r
-    {\r
-      border              : 1px outset #CCD0DD;\r
-      padding             : 0px 2px 0px 2px;\r
-    }\r
-    \r
-  menubutton[disabled="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box\r
-    {\r
-      border              : 1px outset #CCD0DD;\r
-    }\r
-\r
-  menubutton[open="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box\r
-    {\r
-      border              : 1px inset #CCD0DD;\r
-      padding             : 1px 1px -1px 3px;\r
-    }\r
-\r
-  menubutton > .menubutton-internal-box > .menubutton-dual-dropmarker-box > .menubutton-dropmarker\r
-    {\r
-      border              : none;\r
-      list-style-image    : url("chrome://global/skin/scroll-down.gif");\r
-    }\r
-    \r
-  menubutton[disabled="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box > .menubutton-dropmarker\r
-    {\r
-      list-style-image    : url("chrome://global/skin/scroll-down-disabled.gif");\r
-    }\r
-\r
-  menubutton > menupopup\r
-    {\r
-      min-width           : 0px;\r
-      border              : 1px outset #CCD0DD;\r
-    }\r
-    \r
-  menubutton > menupopup > .menupopup-internal-box\r
-    {\r
-      border              : 1px outset #CCD0DD;\r
-    }\r
-    \r
-  menubutton > menupopup > menuitem\r
-    {\r
-      padding             : 0px 0px 0px 3px;\r
-    }\r
-\r
-/** Icon only menubutton.menubutton-duals\r
- *  class="menubutton.menubutton-dual-icon"\r
- **/\r
-  .menubutton.menubutton-dual-icon \r
-    {\r
-      border              : none;\r
-      background-color    : #CCD0DD;\r
-    } \r
-    \r
-  .menubutton.menubutton-dual-icon > .menubutton.menubutton-dual-icon-internal-box\r
-    {\r
-      border              : 1px outset #CCD0DD;\r
-      padding             : 1px;\r
-    }\r
-    \r
-  .menubutton.menubutton-dual-icon:hover:active > .menubutton.menubutton-dual-icon-internal-box,\r
-  .menubutton.menubutton-dual-icon[open="true"] > .menubutton.menubutton-dual-icon-internal-box\r
-    {\r
-      border              : 1px inset #CCD0DD;\r
-      padding             : 2px 0px 0px 2px;\r
-    }    \r
-    
\ No newline at end of file
+
+/* outermost frame */
+  menubutton
+    {
+/*      margin              : 3px 5px 3px 5px; */
+    }
+    
+  menubutton[disabled="true"] 
+    {
+      color               : #999999;
+    }
+  
+  menubutton > .menubutton-internal-box
+    {
+      border              : none;
+      padding             : 0px;
+      vertical-align      : middle;
+    }
+
+  .menubutton-single-icon
+    {
+      margin-right        : 3px;
+    }
+    
+/** "Dual Functionality" menubutton
+ *  Has a popup spawning button and a command invoking button, e.g. back/forward
+ *  class="menubutton-dual"
+ **/    
+  
+/* inner button */
+
+  menubutton > .menubutton-internal-box > .menubutton-dual-button,
+  menubutton:hover > .menubutton-internal-box > .menubutton-dual-button,
+  menubutton[buttonover="true"] > .menubutton-internal-box > .menubutton-dual-button,
+  menubutton:active > .menubutton-internal-box > .menubutton-dual-button
+    {
+      border              : none;
+      margin              : 0px;
+      -moz-border-radius  : 0px;
+    }
+
+  menubutton > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,
+    {
+      border              : 1px outset #CCD0DD;
+      margin              : 0px
+    }
+    
+  menubutton[open="true"] > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box,
+  menubutton > .menubutton-internal-box > .menubutton-dual-button:hover:active > .button-internal-box,
+  menubutton:hover:active > .menubutton-internal-box > .menubutton-dual-button > .button-internal-box
+    {
+      border              : 1px inset #CCD0DD;
+    }
+    
+  menubutton[disabled="true"] > .menubutton-internal-box > .menubutton-dual-button:hover:active > .button-internal-box
+    {
+      border              : 1px outset #CCD0DD;
+    }
+
+
+/* inner dropmarker */
+  menubutton > .menubutton-internal-box > .menubutton-dual-dropmarker-box
+    {
+      border              : 1px outset #CCD0DD;
+      padding             : 0px 2px 0px 2px;
+    }
+    
+  menubutton[disabled="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box
+    {
+      border              : 1px outset #CCD0DD;
+    }
+
+  menubutton[open="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box
+    {
+      border              : 1px inset #CCD0DD;
+      padding             : 1px 1px -1px 3px;
+    }
+
+  .menubutton-dual-dropmarker-box > .menubutton-dropmarker
+    {
+      border              : none;
+      list-style-image    : url("chrome://global/skin/scroll-down.gif");
+    }
+    
+  menubutton[disabled="true"] > .menubutton-internal-box > .menubutton-dual-dropmarker-box > .menubutton-dropmarker,
+  .menubutton-dual-dropmarker-box > .menubutton-dropmarker[disabled="true"]
+    {
+      list-style-image    : url("chrome://global/skin/scroll-down-disabled.gif");
+    }
+
+  menubutton > menupopup
+    {
+      min-width           : 0px;
+      border              : 1px outset #CCD0DD;
+    }
+    
+  menubutton > menupopup > .menupopup-internal-box
+    {
+      border              : 1px outset #CCD0DD;
+    }
+    
+  menubutton > menupopup > menuitem
+    {
+      padding             : 0px 0px 0px 3px;
+    }
+
+/** Icon only menubutton.menubutton-duals
+ *  class="menubutton.menubutton-dual-icon"
+ **/
+  .menubutton.menubutton-dual-icon 
+    {
+      border              : none;
+      background-color    : #CCD0DD;
+    } 
+    
+  .menubutton.menubutton-dual-icon > .menubutton.menubutton-dual-icon-internal-box
+    {
+      border              : 1px outset #CCD0DD;
+      padding             : 1px;
+    }
+    
+  .menubutton.menubutton-dual-icon:hover:active > .menubutton.menubutton-dual-icon-internal-box,
+  .menubutton.menubutton-dual-icon[open="true"] > .menubutton.menubutton-dual-icon-internal-box
+    {
+      border              : 1px inset #CCD0DD;
+      padding             : 2px 0px 0px 2px;
+    }    
+    
+
+

diff --git a/EarlyBlue/navigator/skin/navigator.css b/EarlyBlue/navigator/skin/navigator.css
index fb51b5aa88369b1e4e3b7439d00add43c13bd5ac..a88e9c68953d79c3d296394525d6915170d24dde 100755 (executable)
--- a/EarlyBlue/navigator/skin/navigator.css
+++ b/EarlyBlue/navigator/skin/navigator.css
@@ -41,12 +41,14 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
 /*
  * Images for the main buttons
  */
-.menubutton-dual-button > .button-internal-box > .button-text-container 
+.menubutton-dual-button > .button-internal-box > .button-text-container, 
+.menubutton-dual-ex-button > .button-internal-box > .button-text-container 
   {
     display             : none;
   }
 
-.menubutton-dual-button
+.menubutton-dual-button,
+.menubutton-dual-ex-button
   {
     min-width           : 32px;
     min-height          : 32px;
@@ -193,3 +195,4 @@ window[chromehidden~="extrachrome"] .chromeclass-extrachrome {
   }
 
 
+