Bug 433109 - Menu items suffer from vertical alignment problems on Windows, r=gavin,vlad
authorKai Liu <kliu@mozilla.kailiu.com>
Thu, 04 Sep 2008 20:20:18 -0700
changeset 18823 3239d0a47be050e8b0381b5dd32139f4af563fb9
parent 18822 7b0636303d388bf2c12c21fd3c77b711067833d0
child 18824 4c0fa178b00669ffa4b4dd3b9611e104e2193762
push id1741
push userphilringnalda@gmail.com
push dateFri, 05 Sep 2008 03:21:02 +0000
treeherderautoland@3239d0a47be0 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgavin, vlad
bugs433109
milestone1.9.1b1pre
Bug 433109 - Menu items suffer from vertical alignment problems on Windows, r=gavin,vlad
toolkit/content/widgets/menu.xml
toolkit/themes/winstripe/global/menu.css
widget/src/windows/nsNativeThemeWin.cpp
--- a/toolkit/content/widgets/menu.xml
+++ b/toolkit/content/widgets/menu.xml
@@ -243,17 +243,17 @@
       <xul:label class="menu-iconic-text menu-description" xbl:inherits="value=description" crop="right" flex="10000"/>
     </content>
   </binding>
 
   <binding id="menu-iconic"
            extends="chrome://global/content/bindings/menu.xml#menu-base">
     <content>
       <xul:hbox class="menu-iconic-left" align="center" pack="center">
-        <xul:image xbl:inherits="src=image"/>
+        <xul:image class="menu-iconic-icon" xbl:inherits="src=image"/>
       </xul:hbox>
       <xul:label class="menu-iconic-text" flex="1" xbl:inherits="value=label,accesskey,crop" crop="right"/>
       <xul:hbox class="menu-accel-container" anonid="accel">
         <xul:label class="menu-iconic-accel" xbl:inherits="value=acceltext"/>
       </xul:hbox>
       <xul:hbox class="menu-right" chromedir="&locale.dir;"
                 xbl:inherits="_moz-menuactive,disabled" align="center" pack="center">
         <xul:image/>
--- a/toolkit/themes/winstripe/global/menu.css
+++ b/toolkit/themes/winstripe/global/menu.css
@@ -70,17 +70,17 @@ menuitem.spell-suggestion {
 
 /* ..... internal content .... */
 
 .menu-accel,
 .menu-iconic-accel,
 .menu-text,
 .menu-iconic-text {
   margin: 0px !important;
-  padding: 0px;
+  padding: 1px 0px;
   color: inherit;
 }
 
 .menu-text {
   -moz-padding-start: 1.45em !important;
   -moz-appearance: menuitemtext;
 }
 
@@ -99,45 +99,39 @@ menuitem.spell-suggestion {
 
 .menu-accel,
 .menu-iconic-accel {
   color: inherit;
   -moz-margin-start: 0.74em !important;
   -moz-margin-end: 1.35em !important;
 }
 
-.menu-iconic-left,
-.menu-right {
-  min-width:  1.45em;
-  min-height: 1.21em;
+.menu-iconic-left {
+  min-width: 1.45em;
 }
 
 .menu-iconic-icon {
   width: 16px;
   height: 16px;
 }
 
 menu.menu-iconic > .menu-iconic-left,
 menuitem.menuitem-iconic > .menu-iconic-left {
   -moz-appearance: menuimage;
-}
-
-menu.menu-iconic > .menu-iconic-left > .menu-iconic-icon,
-menuitem.menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
-  /* reduce icon-text crowding */
-  -moz-margin-start: -1px;
-  -moz-margin-end: 1px;
+  padding-top: 2px;
 }
 
 /* ..... menu arrow box ..... */
 
 .menu-right {
   -moz-appearance: menuarrow;
   -moz-margin-end: -2px;
   list-style-image: none;
+  min-width: 1.28em;
+  padding-top: 1px;
 }
 
 /* ::::: menu/menuitems in menubar ::::: */
 
 menubar > menu {
   border: 2px solid transparent;
 }
 menubar > menu[_moz-menuactive="true"][open="true"] {
@@ -193,16 +187,25 @@ menulist > menupopup > menu {
   color: -moz-FieldText;
 }
 
 .menulist-menupopup > menuitem > .menu-iconic-left,
 menulist > menupopup > menuitem > .menu-iconic-left,
 .menulist-menupopup > menu > .menu-iconic-left,
 menulist > menupopup > menu > .menu-iconic-left {
   display: none;
+  padding-top: 0px;
+}
+
+.menulist-menupopup > menuitem > label,
+menulist > menupopup > menuitem > label,
+.menulist-menupopup > menu > label,
+menulist > menupopup > menu > label {
+  padding-top: 0px;
+  padding-bottom: 0px;
 }
 
 menulist > menupopup > menuitem[_moz-menuactive="true"] {
   border: 1px dotted #F5DB95;
   background-color: highlight;
   color: highlighttext;
 }
 
@@ -218,23 +221,25 @@ menulist > menupopup > menuitem > .menu-
 
 menuitem[type="checkbox"],
 menuitem[checked="true"] {
   -moz-appearance: checkmenuitem;
 }
 menuitem[type="checkbox"] > .menu-iconic-left,
 menuitem[checked="true"] > .menu-iconic-left {
   -moz-appearance: menucheckbox;
+  padding-top: 0px;
 }
 
 menuitem[type="radio"] {
   -moz-appearance: radiomenuitem;
 }
 menuitem[type="radio"] > .menu-iconic-left {
   -moz-appearance: menuradio;
+  padding-top: 0px;
 }
 
 menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon,
 menuitem[checked="true"] > .menu-iconic-left > .menu-iconic-icon,
 menuitem[type="radio"] > .menu-iconic-left > .menu-iconic-icon {
   /* prevent .menu-iconic-icon from enforcing a minimal height of 16px (see bug 411064)
      XXXzeniko apply that .menu-iconic-icon rule only for children of .menu-iconic */
   display: none;
--- a/widget/src/windows/nsNativeThemeWin.cpp
+++ b/widget/src/windows/nsNativeThemeWin.cpp
@@ -1802,19 +1802,18 @@ nsNativeThemeWin::ClassicGetWidgetBorder
         }
         else {
           // make top-level menus look sunken when pushed in the Classic look
           (*aResult).top = (*aResult).left = 3;
           (*aResult).bottom = (*aResult).right = 1;
         }
       }
       else {
-        (*aResult).top = 1;
-        (*aResult).bottom = 3;
-        (*aResult).left = (*aResult).right = 2;
+        (*aResult).top = 0;
+        (*aResult).bottom = (*aResult).left = (*aResult).right = 2;
       }
       break;
     }
     default:
       (*aResult).top = (*aResult).bottom = (*aResult).left = (*aResult).right = 0;
       break;
   }
   return NS_OK;